Jump to content

Accessing selected option within <select>


Recommended Posts

Hi guys,I'm having some issues accessing the currently selected option in a drop-down list using JavaScript DOM. The selectedIndex always returns -1 in ie and 0 in chrome and the options array doesn't appear to exist at all in ie but does in chrome. The code and the final HTML seem to check out. Any ideas? Are there any known issues? Here's some code samples:

var searchBox = document.createElement( 'select' );				  				  searchBox.id = thisObject.id+'Search';				  				  for( var i = 0; i < columnNames.length; ++i )				  {					  var searchOption = document.createElement( 'option' );					  					  searchOption.text = columnNames[i];					  					  searchOption.value = searchOption.text;					  					  searchOption.id = searchOption.text;					  					  searchBox.add( searchOption , null ); 				  }

The box is eventually attached to the DOM and displays correctly in ie and chrome with correct HTML. Interestingly just with the following line after the code is placed in the DOM ie 8 falls apart:


This line works in chrome and the HTML code in ie clearly shows the option to exist within the select element.This is all very confusing and frustrating, any ideas guys?Many thanks

Link to comment
Share on other sites

Ok I've solved the problem,The issue was that after that code I was adding to the inner HTML of the containing element with a .innerHTML += " For: " and this seemed to break the functionality. I had to place any further text inside a labal and add that in via .appendChild().Many thanks

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...