Not quite giving the dates correctly

I put a thread out previously and got some responses. I found a help area that gave me what I wanted - kind of.

If the code below is run and NO DATE is put in, the function runs as I expect. However, if there is a date in the DATE box, then, well, the number of days does not change! That seems weird…

I would like this to put the proper number of days via the selected month if it can. Just not sure what is really going on and/or where the issue could be. Looks like this should work like I want, but… well, let the experts beat me and it up!

Oh, I really don’t have a lick of Javascript experience and am doing this for learning more than anything

Here is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=windows-1250">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  
  
  </head>
  <body>
 <form name="myform"><fieldset>
    <legend>Date Selection</legend>
    <label for="year">Year: </label><select name="eventYear" id="eventYear" size="1">
    <option value=" " selected="selected"> </option>
    <option value="2000">2000</option>
    <option value="2001">2001</option>
    <option value="2002">2002</option>
    </select>
    <label for="month">Month: </label>
    <select name="eventMonth" id="eventMonth" size="1">
    <option value=" " selected="selected"> </option>
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
     
    </select>
     
    <label for="day">Day: </label><select name="eventStartDate" id="eventStartDate" size="1">
    <option value=" " selected="selected"> </option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    <option value="21">21</option>
    <option value="22">22</option>
    <option value="23">23</option>
    <option value="24">24</option>
    <option value="25">25</option>
    <option value="26">26</option>
    <option value="27">27</option>
    <option value="28">28</option>
    <option value="29">29</option>
    <option value="30">30</option>
    <option value="31">31</option>
    </select>
    </fieldset>
  </form> 
<script type="text/javascript"> 
  function daysInMonth(month,year) 
  {
    var dd = new Date(year, month, 0);
    return dd.getDate();
  } 
  function setDayDrop(dyear, dmonth, dday)
  {
    var year = dyear.options[dyear.selectedIndex].value;
    var month = dmonth.options[dmonth.selectedIndex].value;
    var day = dday.options[dday.selectedIndex].value;
    if (day == ' ')
    {
    var days = (year == ' ' || month == ' ') ? 31 : daysInMonth(month,year);
    dday.options.length = 0;
    dday.options[dday.options.length] = new Option(' ',' ');
    for (var i = 1; i <= days; i++) 
      dday.options[dday.options.length] = new Option(i,i);
    }
  }
 
  function setDay() 
  {
    var year = document.getElementById('eventYear');
    var month = document.getElementById('eventMonth');
    var day = document.getElementById('eventStartDate');
    setDayDrop(year,month,day);
  }
  document.getElementById('eventYear').onchange = setDay;
  document.getElementById('eventMonth').onchange = setDay;
</script>

  </body>
</html>

Hi,

Even i tried to implement this functionality in my code. But it didn’t worked. please give me any ideas.

Thanks,
Vidya Gupta.

It should not seems weird since that was what is in your code which said change only if day is NO DATE. Remove that and it should be ok.

Update the function to this and see if this is what you are looking for:

  function setDayDrop(dyear, dmonth, dday)
  {

    var year = dyear.options[dyear.selectedIndex].value;
    var month = dmonth.options[dmonth.selectedIndex].value;
    var day = dday.options[dday.selectedIndex].value;

    var days = (year == ' ' || month == ' ') ? 31 : daysInMonth(month,year);
    if(day>days) day=days;
    dday.options.length = 0;
    dday.options[dday.options.length] = new Option(day,day);
    for (var i = 1; i <= days; i++) 
      dday.options[dday.options.length] = new Option(i,i);

  }

ya… i changed the code with the above code… Even though it didn’t worked…

It did work for me with the changes. Click here to test it yourself and see.

Here is my complete listing of the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
   <meta http-equiv="content-type" content="text/html; charset=windows-1250">
   <meta name="generator" content="PSPad editor, www.pspad.com">
   <title>Date</title>
</head>
<body>

<form name="myform"><fieldset>

   <legend>Date Selection</legend>
   <label for="year">Year: </label><select name="eventYear" id="eventYear" size="1">
      <option value=" " selected="selected"> </option>
      <option value="2000">2000</option>
      <option value="2001">2001</option>
      <option value="2002">2002</option>
   </select>
   
   <label for="month">Month: </label>
   <select name="eventMonth" id="eventMonth" size="1">
      <option value=" " selected="selected"> </option>
      <option value="1">January</option>
      <option value="2">February</option>
      <option value="3">March</option>
      <option value="4">April</option>
      <option value="5">May</option>
      <option value="6">June</option>
      <option value="7">July</option>
      <option value="8">August</option>
      <option value="9">September</option>
      <option value="10">October</option>
      <option value="11">November</option>
      <option value="12">December</option>
   </select>
     
   <label for="day">Day: </label><select name="eventStartDate" id="eventStartDate" size="1">
      <option value=" " selected="selected"> </option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option>
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="10">10</option>
      <option value="11">11</option>
      <option value="12">12</option>
      <option value="13">13</option>
      <option value="14">14</option>
      <option value="15">15</option>
      <option value="16">16</option>
      <option value="17">17</option>
      <option value="18">18</option>
      <option value="19">19</option>
      <option value="20">20</option>
      <option value="21">21</option>
      <option value="22">22</option>
      <option value="23">23</option>
      <option value="24">24</option>
      <option value="25">25</option>
      <option value="26">26</option>
      <option value="27">27</option>
      <option value="28">28</option>
      <option value="29">29</option>
      <option value="30">30</option>
      <option value="31">31</option>
   </select>
   </fieldset>
</form>

<script type="text/javascript"> 

   function daysInMonth(month,year) 
   {
	   var dd = new Date(year, month, 0);
	   return dd.getDate();
   } 

   function setDayDrop(dyear, dmonth, dday)
   {
	   var year = dyear.options[dyear.selectedIndex].value;
	   var month = dmonth.options[dmonth.selectedIndex].value;
	   var day = dday.options[dday.selectedIndex].value;

	   var days = (year == ' ' || month == ' ') ? 31 : daysInMonth(month,year);
	   dday.options.length = 0;
	   if(day>days) day=days;
	   dday.options[dday.options.length] = new Option(day,day);

	   for (var i = 1; i <= days; i++) 
		   dday.options[dday.options.length] = new Option(i,i);

   }
 
   function setDay() 
   {
	   var year = document.getElementById('eventYear');
	   var month = document.getElementById('eventMonth');
	   var day = document.getElementById('eventStartDate');
	   setDayDrop(year,month,day);
   }
  
   document.getElementById('eventYear').onchange = setDay;
   document.getElementById('eventMonth').onchange = setDay;

</script>

</body>
</html>