Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Apr 17th, 2012  |  syntax: None  |  size: 3.97 KB  |  hits: 20  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. How do I convert this to JavaScript from PHP?
  2. $startDate =  intval( $c->getStartDate($pid) );
  3.     $endDate =  strtotime('+6 month', $startDate);
  4.     $dateSelectList = '<select name="dateSelect" id="dateSelect">';
  5.     $count = 1;
  6.     //populates the select list with the starting date of the course up to the next six months
  7.     for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
  8.     {
  9.         $dateSelectList .= '<option id="select'.$count.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
  10.         $count++;
  11.     }
  12.  
  13.     $dateSelectList .= '</select>';
  14.        
  15. $startDate =  intval( $c->getStartDate($pid) );
  16. $endDate =  strtotime('+6 month', $startDate);
  17. $dateSelectList = '';
  18. $count = 1;
  19. //populates the select list with the starting date of the course up to the next six months
  20. for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
  21. {
  22.     $dateSelectList .= '<option id="select'.$count.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
  23.     $count++;
  24. }
  25.  
  26. echo $dataSelectList;
  27.        
  28. <script>
  29. $(function(){
  30.    $.get('populate.php',function(data)
  31.    {
  32.        $('#dateSelect').html(data);
  33.    }
  34. });
  35. </script>
  36.        
  37. <html>
  38. <head>
  39.     <title>Demo Javascript populing select field</title>
  40.     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" ></script>
  41.     <script type="text/javascript" >
  42.         $("document").ready(function(){
  43.             nElement = 6;
  44.             sList = {};
  45.             for (i = 0; i<=nElement; i++) {
  46.                 var now = new Date();
  47.                 var nextDate = new Date();
  48.                 nextDate.setMonth(now.getMonth()+(i*6));
  49.                 var value = nextDate.getMonth()+"/"+nextDate.getFullYear();
  50.                 sList[value] = value;
  51.             }
  52.  
  53.  
  54.             $.each(sList, function(key, value){
  55.                 var option = $("<option></option>").attr("value",key).text(value);
  56.                 $("#demo-select").append(option);
  57.  
  58.             });
  59.         });
  60.     </script>
  61. </head>
  62. <body>
  63.     <select name="demo-select" id="demo-select" ></select>
  64. </body>
  65.        
  66. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  67. <html>
  68.     <head>
  69.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  70.         <title>Untitled Document</title>
  71.     </head>
  72.  
  73.     <script>
  74.         function newOption(value, text) {
  75.             var opt = document.createElement('option');
  76.             opt.text = text;
  77.             opt.value = value;
  78.             return opt;
  79.         }
  80.  
  81.         function formatDate(date) {
  82.             var da = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'],
  83.                 ma = ['January','February','March','April','May','June','July','August','September','October','November','December'],
  84.                 dr = date.getDate(),
  85.                 wr = date.getDay(),
  86.                 mr = date.getMonth(),
  87.                 yr = date.getFullYear(),
  88.                 dn = da[wr],
  89.                 ds = (dr.toString().length == 1) ? '0' + dr.toString() : dr.toString(),
  90.                 mn = ma[mr],
  91.                 ys = yr.toString(),
  92.                 v = dn + ' ' + ds + ' ' + mn + ' ' + ys;
  93.  
  94.             return v;
  95.         }
  96.  
  97.         function PopulateDateSelector(startDate, endDate, selector) {
  98.             while(selector.length > 0) selector.remove(0);
  99.  
  100.             while(startDate < endDate) {
  101.                 selector.add(newOption(startDate.getTime().toString(), formatDate(startDate)));
  102.                 startDate.setTime(startDate.getTime() + (24*60*60*1000));
  103.             }
  104.         }
  105.  
  106.  
  107.     </script>
  108.     <body>
  109.  
  110.         <select id="dateSelector"></select>
  111.  
  112.         <script type="text/javascript">            
  113.             var s = document.getElementById('dateSelector'),
  114.                 startDate = new Date(),
  115.                 endDate = new Date(startDate.getTime() + (182*24*60*60*1000));
  116.                 //182 is estimated number of days in a 6 month period.
  117.  
  118.             PopulateDateSelector(startDate,endDate,s);
  119.         </script>
  120.     </body>
  121. </html>