View Full Version : Bind new json data to Itemselector

4 Nov 2014, 9:24 AM
Hi All,

I am using extjs 4.2. I have an itemselector as below. Initially, my itemselector is empty.

Now, on click of "Return to Default". I want to load new json data into the itemselector.

I tried to use loaddata, loadRawData, bindStore but the new data is not showing the available.

But after loaddata, when i use Ext.getCmp('pgmMyViewSelector').getStore().getCount() , i get result as 2.

That means it has binded the store but it is not showing.

5 Nov 2014, 2:20 PM
It may be helpful for the community to see a test case demonstrating your code so far including the Itemselector component and sample data.

You can share a test case inline or at https://fiddle.sencha.com

7 Nov 2014, 4:42 AM
Hi Slemmon,

Same issue is been posted before.


Please help, its a bug in itemselector.


7 Nov 2014, 11:26 AM
I tried the itemselector code in the bug report FIXED as EXTJS-5949, and it seemed to work okay for me with 4.2.1. In this case the store already has the data loaded when it is bound. So it looks like that part was fixed.

What didn't work for me with 4.2.1. is when the store is loaded after it is bound. (I think if the store is initially associated with the ItemSelector it would put the load listener on the correct store, it would not work when associating a different store by directly calling bindStore()).

Looking at the code for binding the new store to the itemselector, it is dependent upon a load event being fired by the store so loadData and loadRawData would not work since 'load' doesn't appear to be fired for those.

ItemSelector.onBindStore() populates the "from" store on store's load event :

if (store.getCount()) {
} else {
me.store.on('load', me.populateFromStore, me);

That looked good until I realized that me.store at that point was the old store and not the new store. The bindStore code (bindable mixin on MultiSelect) sets the new store on 'me' after the call to onBindStore().

bindStore: function(store, initial, propertyName) {

propertyName = propertyName || 'store';

var me = this,
oldStore = me[propertyName];

if (!initial && oldStore) {

me.onUnbindStore(oldStore, initial, propertyName);

if (store !== oldStore && oldStore.autoDestroy) {
} else {
if (store) {
store = Ext.data.StoreManager.lookup(store);
me.onBindStore(store, initial, propertyName); <------onBindStore called
me[propertyName] = store || null; <------- store set on 'me' after onBindStore called
return me;

For testing purpose I got this to work by modifying one line in ItemSelector's onBindStore()

if (store.getCount()) {
} else {
// me.store.on('load', me.populateFromStore, me);
store.on('load', me.populateFromStore, me); <--- add listener to new store

8 Nov 2014, 8:51 PM
Hi Carol,

I tired your solution, but it didnt work for me. The problem is that itemselector is binding to the new store but the from fields are not being populated. It just show blank. But when i do a

Ext.getCmp('newItem').getStore().getCount() it gives me a value = 7. that means the store binding happened.

But how to show those new fields ?

Please help.

10 Nov 2014, 12:16 PM
You tried exactly what solution that I suggested?

A fiddle like slemmon suggested could help.

Is your requirement to bind a new store? Are you able to call load() (rather than loadData or loadRawData on your store?