Jquery adding option to select

So here’s a problem I “solved” today involving html select and dynamically adding options.

Maybe this isn’t the best solution but it worked for me.

Originally I was using jquery to dynamically add options to a select I created.

However for some reason that doesn’t work in IE. (kind of defeats the purpose of using jquery).

So the work around was to create/use a function that was written years ago.

  // from: http://jimkeller.blogspot.ca/2006/09/ie-doesnt-show-option-text-when_14.html  function set_option( id, mylabel, myvalue )  {  	if( myvalue.length > 0  )  	{  	select_obj = document.getElementById(id);  	optgroup_obj = document.createElement('optgroup');  	option_obj = document.createElement('option');    	option_obj.label = mylabel;  	option_obj.value = myvalue;    	if ( typeof(option_obj.innerText) != 'undefined' ) {  	 option_obj.innerText = mylabel;  	}  	else {  	 option_obj.text = mylabel;  	}    	optgroup_obj.appendChild(option_obj);   	select_obj.appendChild( optgroup_obj );   	}  }

Original idea and code came from.

Jim Keller Blog

The original code looked something like this.

      $("#"+option_name).append(new Option( option_array[i], option_array[i], true, true));

That just doesn’t work in IE. I didn’t spend the time to debug jquery to figure out exactly why either.

I haven’t really tested my function extensively.

Issues: I know it has issues with layout that I worked around by shoving the select in a table column/row.
Restored by Emergency Restore

Leave a Reply

Your email address will not be published. Required fields are marked *