I have a dynamically generated select with some options and it shows the options fine in normal browsers, but its empty options in IE. Here's the generated HTML:
<select name="0" id="custom_0" style="border-bottom: #c0cedb 1px solid; border-left: #c0cedb 1px solid; background-color: #ededed; width: 280px; font-size: 0.87em; border-top: #c0cedb 1px solid; border-right: #c0cedb 1px solid">
<option id="1000" value="0" name="00">1x2GB ECC DDRIII 2GB ECC DDRIII</option>
<option id="1001" value="10" name="01">2x2GB ECC DDRIII 4GB ECC DDRIII (+10.00 €)</option>
</select>
I can't really show you the javascript, since there's so much of it and I would be able to make it simple just for a demo. Maybe you had some of you would've had a similar experience and could figure this one out. Thanks
I've added some javascript:
$('#custom_order').append('<tr id="custom_'+category+'_row"><td'+padding+'>'+header+'<select id="custom_'+category+'" name="'+category+'" style="background-color:#EDEDED;border:1px solid #C0CEDB;width:280px;font-size:0.87em"></select>'+plusspan+'</td></tr>');
for (var i=0;i<components[category]['value'].length;i++){
$('#custom_'+category).append('<option id="'+components[category]['value'][i]['id']+'" value="'+components[category]['value'][i]['price']+'"></option>');
removals(category,i);
dependencies(category,i);
selectInput(category);
}
getDiff(category);
getDiff() function adds the values to the options with html() function. The weird thing is, if I alert the html of the option just after the getDiff() function, it shows the value filled out. And it I put the getDiff() function in the for loop where the options are generated, it fills the values and shows them in IE, just not the last one.
I'm calling getDiff() outside the loop for optimization, and since I can add the values later after all the options are generated. Well at least I thought I could, since it works on Firefox and Chrome.
