Question

I created a script that requires selecting a beginning year then only displays years from that Beginning year -> 2009. It’s just a startYear to endYear Range selector.

The script only works in firefox. I’m LEARNING javascript, so I’m hoping someone can point me into the right direction. Live script can be found at http://motolistr.com

<script type='text/javascript'> function display_year2(start_year) { //alert(start_year); if (start_year != 'Any') {     var i;     for(i=document.form.year2.options.length-1;i>=0;i--)     {         document.form.year2.remove(i);     }      var x = 2009;     while (x >= start_year) {         var optn = document.createElement('OPTION');         optn.text = x;         optn.value = x;         document.form.year2.options.add(optn);         //alert(x);         x--;     } } else  {     var i;     for(i=document.form.year2.options.length-1;i>=0;i--)     {         document.form.year2.remove(i);     }     var optn = document.createElement('OPTION');     optn.text = 'Any';     optn.value = 'Any';     document.form.year2.options.add(optn); } // end else } // end function </script> 

Any ideas?

Thanks, Nick

Answer 1

You are trying to set an onclick event on each option. IE does not support this. Try using the onchanged event in the select element instead.

Instead of this:

<select name='year1' id='year1'>     <option value='Any' onclick='javascript:display_year2('Any');' >Any</option>     <option value='2009' onclick='javascript:display_year2(2009);' >2009</option>     <option value='2008' onclick='javascript:display_year2(2008);' >2008</option> </select> 

Try this:

<select name='year1' id='year1' onchange='javascript:display_year2(this.options[this.selectedIndex].value)'>     <option value='Any'>Any</option>     <option value='2009'>2009</option>     <option value='2008'>2008</option> </select>