date form validation

[zubair]

Hi

I have the following form (code pasted below) basically has two date range to do search from (drop down selects)
yyyy - m - d to yyyy-m-d

I'm not really an expert in javascript. What i would like is some help in this. I would like the javascript to validate the following

1. the date to must be greater than the date from
2. if february is selected in any of the month drop downs to make sure it has not more than 28 days unless it is a leap year selected.

Please any help greatly appreciated.

<form name="filters" id="filters" action="#self#?fuseaction=#XFA_ProcessSearch#&RequestTimeout=500" method="post" target="SearchResultsFrame" onsubmit="return checkdatesearch();">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="filterTextSmall"><b>Del Date From</b>&nbsp;</td>
<td>
<select name="yearfrom" class="FormFieldSelectDateYear60px">
<option value="2000" >2000</option>
<option value="2001" >2001</option>
<option value="2002" >2002</option>
<option value="2003" selected>2003</option>
<option value="2004" >2004</option>
</select>
<select name="monthfrom" class="FormFieldSelect100px">
<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 selected>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>
<select name="dayfrom" class="FormFieldSelect45px">
<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" selected>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>
</td>
<td class="filterTextSmall"><b>Del Date To</b>&nbsp;</td>
<td>
<select name="yearto" class="FormFieldSelectDateYear60px">
<option value="2000" >2000</option>
<option value="2001" >2001</option>
<option value="2002" >2002</option>
<option value="2003" selected>2003</option>
<option value="2004" >2004</option>
</select>
<select name="monthto" class="FormFieldSelect100px">
<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 selected>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>
<select name="dayto" class="FormFieldSelect45px">
<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" selected>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>
</td>
</tr>
</table>
</form>

[Charles]

It's a great deal easier if you let your users just type in a date.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<style type="text/css">
<!--
label {display:block; margin:1em 0em}
input {display:block}
-->
</style>
<form action="">
<div>
<label>Date From<input type="text" name="from" onchange="this.value = new Date(this.value).toDateString()"></label>
<label>Date To<input type="text" name="to" onchange="this.value = new Date(this.value).toDateString(); if (new Date(this.value).getTime() <= new Date(this.form.from.value).getTime()) {alert ('The \'to\' date must be greater than the \'from\' date'); this.value=''; this.focus()}"></label>
<button type="submit">Submit</button>
</div>
</form>

[zubair]

thanks for the reply, but i can't use text fields where the user can input the date hilself. It has to be using the drop down selects.

Any more help or ideas?

Thanks