PDA

View Full Version : DomHelper.append failed on IE if add options to select



snemeth72
10 Sep 2010, 1:34 PM
Hi!

I try to add options to an empty select with DomHelper.append and insertFirst, but it faild in IE. The same code works in FF.


<select id="country">
<option value="-1" selected="selected">Loading country list...</option>
</select>



Ext.DomHelper.append('country',[


{tag:'option', cls:'some-class', html:'1', value:'1'},

{tag:'option', cls:'some-class', html:'2', value:'2'}
]
);





It worked in both browser only if i rebuild the whole select with options as cn: attribute.




Ext.DomHelper.append('tdiv',{

tag:'select',

cls:'some-class',

name:'country',

value:'1',

cn:[

{tag:'option', html:'One', value:'1'},

{tag:'option', html:'Two', value:'2'},
{tag:'option', html:'Three', value:'3'},
{tag:'option', html:'Four', value:'4'}
]
}
);





Other DomHelper operations worked in both browser (add li to ul; add p to div;...) only options failed in IE.


Do i use it wrong way? Is it possible to add options to (almost) empty select?


Thanks!


snemeth72

Condor
10 Sep 2010, 11:13 PM
It's a bug (http://support.microsoft.com/kb/276228) in Internet Explorer (the other way to add options is to add new Option objects).

snemeth72
11 Sep 2010, 1:58 PM
Hi Condor,

meny thanks for quick replay! You are right, i forget to mention the IE version i use. It's IE 8. The bug you linked said that applies to IE 5-5.5. Do you think it's bug is in the product in v8, and not repaired yet?

OK, i'll use new option object!

Thanks again!

snemeth72

Animal
12 Sep 2010, 6:29 AM
Set



Ext.DomHelper.useDom = true;


When doing that.

snemeth72
13 Sep 2010, 2:08 AM
As far as i see this public property (useDom) is in the 3.2.1 ExtJS but not in ExtCore 3.0. Maybe do you know when new version of Ext core (with this property) is planned to release?

Thanks!

s

Animal
13 Sep 2010, 3:41 AM
Doesn't it work then?

snemeth72
13 Sep 2010, 12:39 PM
Unfortunately doesn't. Doesn't cause javascript error, but does nothing. I tried the following code:


Ext.DomHelper.useDom =true;

Ext.DomHelper.append('country',[
{tag:'option', cls:'some-class', html:'1', value:'1'},

{tag:'option', cls:'some-class', html:'2', value:'2'}

]);





I just wanted to use homogeneous Ext core code, but instead now use option object this way:



var countryCombo = Ext.get('country');
countryCombo.dom.options.add(new Option("1","1"));


countryCombo.dom.options.add(new Option("2","2"));




It works for both browsers.




Condor, i managed to reproduce the linked bug according to bug description in IE8. Unbelivable they couldn't repair it until now... :(




Thanks a lot both of you!




snemeth72