PDA

View Full Version : ComboBox, JsonStore data load issue



jbeaven
23 Mar 2011, 2:10 PM
So this may be completely trivial but I'm having a heck of a time with it.

I'm just creating a state dropdown box for a form. The code I'm using is below.


stateSelect = new Ext.form.ComboBox(
{
allowBlank: false,
displayField:'stateSelect',
typeAhead: true,
mode: 'local',
triggerAction: 'all',
emptyText:'Select a State...',
selectOnFocus:true,
transform: 'stateSelect',
store: new Ext.data.JsonStore({
storeId: 'refStatesStore',
url: this.refStates
})
});


My problem is that my dropdown box isn't loaded with any data. I tried putting a root of "items" and fields of "code" and "value" as they are in the file but to no avail.

I'm just not sure if I'm missing something key or if I can even do it "on the fly" like this though I don't see why it would be a problem.

Thoughts? Am I completely useless?

fay
23 Mar 2011, 2:50 PM
The first thing I'd do is make sure that I can load the store, without bother about the combo (yet).



var statesStore = new Ext.data.JsonStore({
storeId: 'refStatesStore',
url: this.refStates
root: 'items',
idProperty: 'code', // Is this correct?
fields: ['code', 'value']
});

statesStore.on('load', function(store, records, options)
{
console.log(records.length);
});

statesStore.load();



Use Firefox + Firebug (and ext-all-debug.js), and if the above doesn't load for you look at what's been returned from your server. Make sure that the JSON is valid by double-checking it with www.jsonlint.com (http://www.jsonlint.com).

When the store loads correctly, then sort out the combo. Double-check (in the docs (http://dev.sencha.com/deploy/dev/docs/?class=Ext.form.ComboBox)) that you need all the config options you've specified, and that the displayField (and valueField, if required) are set to the correct fields in your store:



var stateSelects = new Ext.form.ComboBox(
{
allowBlank: false,
displayField: 'value',
valueField: 'code',
mode: 'local',
triggerAction: 'all',
emptyText: 'Select a State...',
store: statesStore
});

jbeaven
24 Mar 2011, 6:48 AM
Thanks for the information fay. Taking it apart the proxy is apparently undefined when to load the store so now I need to track that down but it's more of a starting point than I had.

ewomack
24 Mar 2011, 7:35 AM
Heh, no, you're not useless. I struggled with combo boxes for a long time, but now I can pretty much get them working on the first try.

Fay's advice is excellent and is the procedure I use for nearly all Json fed widgets: call the method that will load your combo box first to verify that the Json correctly formats out of the procedure. If it doesn't, you'll never get the combo to work.

Also, do you plan on moving this to a remote store or will it stay local? When moving it to remote you'll probably find some more minor configuration issues.

jbeaven
24 Mar 2011, 7:40 AM
This piece is part of a service that gets called so theoretically all of the store data given to the service will be local when this gets called. That's the idea anyway so I'm hoping not to have any more tweaking to do.