Question

the following js works fine in FF2 but in IE6 the dropdown always selects one option to early, IE -> testix2 vs. FF2 -> testix3 If we add an alertBox somewhere in the script, it also works fine in IE6. But how to solve this without an alertBox?

tia

<script language='JavaScript' type='text/javascript'> <!-- function Entry(value, name, selected) {     this.value = value;     this.name = name;     this.selected = selected; }   //--> </script>         <select id='selSeaShells'>          </select> <script language='JavaScript' type='text/javascript'> <!-- var productCategoryLevel2 = new Array();  productCategoryLevel2.push(new Entry('Hallo1', 'testix1', false)); productCategoryLevel2.push(new Entry('Hallo2', 'testix2', false)); productCategoryLevel2.push(new Entry('Hallo3', 'testix3', true));      var i = 0;         for (i in productCategoryLevel2) {         var optL2 = document.createElement('option');         optL2.selected = true;                  optL2.text = productCategoryLevel2[i].name;         optL2.value = productCategoryLevel2[i].value;         if (productCategoryLevel2[i].selected == true) {             productCategoryLevel2[i].selected = true;             optL2.selected = true;         } else {             optL2.selected = false;              }                 try {             document.getElementById('selSeaShells').add(optL2, null);                 } catch(ex3) {             document.getElementById('selSeaShells').add(optL2);                 }         } //--> </script> 

Answer 1

I’m not entirely sure why your example does not work, but it works if you do it like this (i.e. setting the selectedIndex on the <select> rather than setting the <option>’s selected propery). Tested FF3, IE6, Chrome.

var i = 0; for (i in productCategoryLevel2) {     var optL2 = document.createElement('option');      optL2.text = productCategoryLevel2[i].name;     optL2.value = productCategoryLevel2[i].value;     try {         document.getElementById('selSeaShells').add(optL2, null);     } catch(ex3) {             document.getElementById('selSeaShells').add(optL2);     }      if (productCategoryLevel2[i].selected == true) {             document.getElementById('selSeaShells').selectedIndex = i;     }       }