topical media & game development

talk show tell print

basic-javascript-06-ch6-examp9.htm / htm



  <html>
  <head>
  <script language="JavaScript" type="text/javascript">
  function writeOptions(startNumber, endNumber)
  {
    var optionCounter;
    for (optionCounter = startNumber; optionCounter <= endNumber; optionCounter++)
    {
        document.write('<option value=' + optionCounter + '>' + optionCounter);
    }
  }
  function writeMonthOptions()
  {
     var theMonth;
     var monthCounter;
     var theDate = new Date(1);
     for (monthCounter = 0; monthCounter < 12; monthCounter++)
     {
        theDate.setMonth(monthCounter);
        theMonth = theDate.toString();
        theMonth = theMonth.substr(4,3);
        document.write('<option value=' + theMonth + '>' + theMonth);
     }
  }
  function recalcDateDiff() 
  {
    var myForm = document.form1;
     var firstDay = myForm.firstDay.options[myForm.firstDay.selectedIndex].value;
     var secondDay = 
        myForm.secondDay.options[myForm.secondDay.selectedIndex].value;
     var firstMonth =
        myForm.firstMonth.options[myForm.firstMonth.selectedIndex].value;
     var secondMonth =
        myForm.secondMonth.options[myForm.secondMonth.selectedIndex].value;
     var firstYear =
        myForm.firstYear.options[myForm.firstYear.selectedIndex].value;
     var secondYear =
        myForm.secondYear.options[myForm.secondYear.selectedIndex].value;
     var firstDate = new Date(firstDay + " " + firstMonth + " " + firstYear);
     var secondDate = new Date(secondDay + " " + secondMonth + " " + secondYear);
     var daysDiff = (secondDate.valueOf() - firstDate.valueOf());
     daysDiff = Math.floor(Math.abs((((daysDiff  / 1000) / 60) / 60) / 24));
     myForm.txtDays.value = daysDiff;
     return true;
  }
  function window_onload()
  {
     var theForm = document.form1;
     var nowDate = new Date();
     theForm.firstDay.options[nowDate.getDate() - 1].selected = true;
     theForm.secondDay.options[nowDate.getDate() - 1].selected = true;
     theForm.firstMonth.options[nowDate.getMonth()].selected = true;
     theForm.secondMonth.options[nowDate.getMonth()].selected = true;
     theForm.firstYear.options[nowDate.getFullYear()- 1970].selected = true;
     theForm.secondYear.options[nowDate.getFullYear() - 1970].selected = true;
  }
  </script>
  </head>
  <body language=JavaScript onload="return window_onload()">
  <form name=form1>
  <p>
  First Date<br>
  <select name=firstDay size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeOptions(1,31);
  </script>
  </select>
  <select name=firstMonth size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeMonthOptions();
  </script>
  </select>
  <select name=firstYear size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeOptions(1970,2020);
  </script>
  </select>
  </p>
  <p>
  Second Date<br>
  <select name=secondDay size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeOptions(1,31);
  </script>
  </select>
  <select name=secondMonth size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeMonthOptions();
  </script>
  </select>
  <select name=secondYear size=1 onchange="return recalcDateDiff()">
  <script language=JavaScript>
     writeOptions(1970,2020);
  </script>
  </select>
  </p>
  Total difference in days
  <input type="text" name=txtDays value=0 readonly>
  <br>
  </form>
  </body>
  </html>
  


(C) Æliens 20/2/2008

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.