PDA

View Full Version : IE8 Issues when loading multiple comboboxes



snipeg
15 Jan 2012, 11:42 PM
Hi Everyone:
I'm new to Ext, and I'm having what I think is a weird issue.

This is the situation, I've a form page, that contains four comboboxes that loads data using a store, which loads the data through and ajax request. (Every combo does a single xhr request)

Using IE8, everything is messed up due that I get some errors that read:

SCRIPT5007: Unable to get value of the property 'isReader': object is null or undefined
ext-all.js, line 7 character 283424
SCRIPT5007: Unable to get value of the property 'afterEdit': object is null or undefined
ext-all.js, line 7 character 294839
SCRIPT5007: Unable to get value of the property 'afterEdit': object is null or undefined

The most weird thing is that, if I leave only two combos on the page, then everything works fine, but if I add a third combo, then everything is messed up again and I get the errors above.
This is the code which generates the comboboxes:


// conf should have:
// ajaxURL ...
// replaceElement Replace element
// fieldNamecontrol name
generic : function (conf) {
// ext models :-|
Ext.define('GenericOption', {
extend: 'Ext.data.Model',
fields: [
{name: 'text', type: 'string'},
{name: 'code', type: 'string'}
]
});

// country dropdown

var goStore = Ext.create('Ext.data.Store', {
model : 'GenericOption',
proxy: {
type: 'ajax',
url : conf.ajaxURL,
reader: { type: 'json' }
},

});
var replaceElement = Ext.get(conf.replaceElement);
new UI.ComboBox({
id : conf.fieldName + '-cmp',
name : conf.fieldName,
width: 360,
emptyText: replaceElement.getAttribute('title'),
displayField: 'text',
valueField: 'code',
renderTo: replaceElement.wrap({tag: 'div'}),
store: goStore,
queryMode : 'local'
});


goStore.load(function(){
Ext.getCmp(conf.fieldName + '-cmp').setValue(replaceElement.getValue());
replaceElement.remove();
});

}

So, the steps to reproduce the error in IE8:
- Adding more than two combos into the page raises multiple errors, and the ui is messed up.
- Having only two combos everything works fine.
- The above code works perfect on chrome, FF, and IE9

Any help will be very appreciated.

Many thanks in advance!

Guillermo

mitchellsimoens
16 Jan 2012, 9:40 AM
I would move the Ext.define for your model outside. No need to redefine it multiple times.
Don't use id unless debugging.
Could be something with UI.ComboBox

snipeg
16 Jan 2012, 11:29 AM
Mitch, many thanks for your answer :)

I've moved the define statement outside the function. Thanks,
I've also implemented all your suggestions, but the combos doesn't work yet :(, I'm still checking what happens here....

Many thanks again.

Guillermo

abdul haq
18 Sep 2013, 3:39 AM
var goStore = Ext.create('Ext.data.Store', { model : 'GenericOption', proxy: { type: 'ajax', url : conf.ajaxURL, reader: { type: 'json' } }, });
Remove comma at the end of proxy..it should be like following

var goStore = Ext.create('Ext.data.Store', { model : 'GenericOption', proxy: { type: 'ajax', url : conf.ajaxURL, reader: { type: 'json' } } });
Thanks,
Abdul Haq:)