PDA

View Full Version : ArrayCombo



mdavis6890
20 Feb 2011, 9:40 AM
I'm trying to get a ComboBox with an ArrayStore working properly.

Can somebody give me a quick example of something from Ext4?

Thanks,
Michael

renku
20 Feb 2011, 1:59 PM
Something like this should work:



new Ext.form.ComboBox({
store: Ext.create('Ext.data.ArrayStore', {
fields: [ 'email' ],
data: [
['test@example.com'],
['someone@example.com'],
['someone-else@example.com']
]
}),
displayField: 'email',
fieldLabel: 'Send To',
queryMode: 'local',
name: 'to',
renderTo: document.body
});


Interestingly when I tried to get this working with using dynamic class loading (not using ext-all-debug.js) it wasn't enough when I specified:



Ext.require([
'Ext.form.ComboBox',
'Ext.data.ArrayStore'
]);


Instead I had to add several more:



Ext.require([
'Ext.form.ComboBox',
'Ext.data.ArrayStore'
"Ext.data.AjaxProxy",
"Ext.data.JsonReader",
"Ext.data.JsonWriter",
"Ext.data.ArrayReader"
]);


Why do I need AjaxProxy when creating ArrayStore?

mdavis6890
21 Feb 2011, 8:07 AM
There seems to be a bug, but I'm not exactly sure. Try using an int for the value field:




new Ext.form.ComboBox({
store: Ext.create('Ext.data.ArrayStore', {
fields: [ 'email' ],
data: [
[1],
[2],
[3]
]
}),
displayField: 'email',
fieldLabel: 'Send To',
queryMode: 'local',
name: 'to',
renderTo: document.body
});



I made this change and it seems to fix the problem:





createPicker: function() {
var me = this,
picker,
opts = {
selModel: {
mode: me.multiSelect ? 'SIMPLE' : 'SINGLE'
},
floating: true,
hidden: true,
ownerCt: this.ownerCt,
renderTo: document.body,
store: me.store,
displayField: me.displayField,
width: me.listWidth,
maxHeight: me.listMaxHeight,
loadingText: me.listLoadingText,
emptyText: me.listEmptyText
};

if (me.getInnerTpl) {
opts.getInnerTpl = me.getInnerTpl;
}

picker = new Ext.view.BoundList(opts);

// Ensure the selected Models display as selected.
if (me.value) {
//me.select(me.value.split(me.delimiter)); Breaks if value is int.
me.select(me.value);
}

me.mon(picker.getSelectionModel(), {
selectionChange: me.onListSelectionChange,
scope: me
});

return picker;
},

shaun.trennery
27 Feb 2011, 9:14 AM
Replacing this line as per the comment above did the trick.

mdavis6890
27 Feb 2011, 9:33 AM
I don't know enough to figure whether this is a brutish hack or an elegant bug fix.

Why was the value being split in the first place?

Michael

hulstein
11 Mar 2011, 12:20 AM
So probably cleaner to do it like this:




// Ensure the selected Models display as selected.
if (me.value) {
if ( typeof( me.value ) == 'number' ) {
me.select(me.value);
} else {
me.select(me.value.split(me.delimiter));
}
}