PDA

View Full Version : Load the Combobox with the Json File



nil5286
28 Feb 2012, 4:08 AM
Hi,

I've a problem loading combobox from a Json file Below is the exception i get

uncaught exception: Either a valid store, or a HTML select to transform, must be configured on the combo.


Ext.define('FieldsetDynamicControls', {
extend: 'Ext.data.Model'
, fields: ['name', 'label', 'config']
});


var userStore;
Ext.require('Ext.data.Store');
Ext.onReady(function () {


Ext.create('Ext.form.field.ComboBox', {
fieldLabel: 'Select a single state',
renderTo: Ext.getBody(),
displayField: 'name',
valueField: 'label',
width: 320,
labelWidth: 130,
store: userStore,
queryMode: 'local',
typeAhead: true
});


userStore = Ext.create('Ext.data.Store', {
model: 'FieldsetDynamicControls',
autoLoad: true,
proxy: {
type: 'ajax',
//the store will get the content from the .json file
url: '/controllist.json',
reader: {
type: 'json',
root: 'list'
},
writer: {
type: 'json'
}
}


});
});


My Json file is as below:


{list:[
{ label: 'Display Name', name: 'displayName' }
, { label: 'First Name', name: 'givenName' }
, { label: 'Middle Name', name: 'initials' }
, { label: 'Last Name', name: 'sn' }
, {
label: 'Checkbox'
, name: 'checkbox'
, config: { xtype: 'checkbox' }
}
, {
label: 'Combo'
, name: 'combo'
, config: { xtype: 'combo' }
}
, {
label: 'Number'
, name: 'number'
, config: { xtype: 'numberfield' }
}
, {
label: 'Date'
, name: 'date'
, config: { xtype: 'datefield' }
}
]
}

Any help is appreciated. I am using extjs 4.0.2a.

Thanks

Farish
28 Feb 2012, 4:28 AM
you should create the store before you create the combobox. userStore is undefined when you use it in creating the combobox.

nil5286
1 Mar 2012, 3:06 AM
Thanx very much , ya i just realized that and it fixed my problem.