Cross Browser Error: document.getElementById (). Value does not work in IE, but works in Firefox.

Question

I have 1 drop-down list [year], 2 text field [startDate, endDate] , when the user selects the year from the drop-down menu, then the startDate text fields should be automatically populated up to endDate 01/01/+year and endDate up to endDate 12/31/+year . The below mentioned script works fine in Firefox, but in IE getElementById ('ff5'). Value doesn't work, any suggestions?

My script:

 <script> function autoPopulateDate(value, startDt,endDt){ document.getElementById(startDt).value='01/01/'+value; document.getElementById(endDt).value='12/31/'+value; } </script> 

HTML code:

 <tr> <td> <select onchange="autoPopulateDate(this.value,'ff5','ff6')" size="1" name="ff4" id="ff4"><option value="">--&gt;select value&lt;--</option><option value="2005">2005</option> <option value="2006">2006</option> <option value="2007">2007</option> <option value="2008">2008</option> <option value="ALL">ALL</option> </select> </td> </tr> <tr> <td ><font class="rtabletext">Savings Start Date: </font></td> <td > <input type="text" value="" name="ff5" id="ff5" maxlength="50" size="10" class="text"> </td> </tr> <tr> <td><font class="rtabletext">Savings End Date: </font></td> <td> <input type="text" value="" name="ff6" id="ff6" maxlength="50" size="10" class="text"> </td> </tr> 

Answer 1

IE [at least some versions and rendering modes] wants you to access form members through a collection of forms.

 document.forms['someform'].elements['someelement'].value 

Alternatively, you can use some ajax library (for example, http://www.asp.net/ajax ) and use this method of searching for library elements, since they usually take browser compatibility information into account ...

 $get('element')