Question

I am trying to dynamically build a form based on data returned from the server. In this instance, I do not have my store in the <PROJECT NAME>/store folder. I have it in <PROJECT NAME>/store/admin. It is defined like this:

Ext.define('APP.store.admin.TaskOption', {
extend: 'Ext.data.Store',
autoLoad: false,
storeId: 'adminTasksOptions',
model: 'APP.model.admin.TaskOption',
sorters: [
    { property: 'order', direction: 'ASC' }
]
});

Please notice the storeId.

Now in my controller, I tried this in the init method, but it did not work (ie: it did not call the taskOptionsLoaded method.

      Ext.create('APP.store.admin.TaskOption');

      this.getAdminTasksOptionStore().on({
          scope: this,
          load : this.taskOptionsLoaded
      });

Also note, that when I did a break point and checked, this.getAdminTaskOptionStore returned the correct store. I am guessing that is happening because I am putting the store in a sub folder? Not sure, but instead of reorganizing folder structure and putting them all in the store folder (I have a ton of stores; large project), I am trying to find a solution so I can keep files organized so it is easy for the next guy.

So now I have tried this, and this doesn’t work either. This is being executed in a method in the same controller.

Ext.getStore('adminTasksOptions').load(
        {'params' : {'t_id' : this.selectedTaskTemplate},
        callback: function(store, records, success) {
            this.taskOptionsLoaded(store, records, success);
        }
    },this);

When I breakpoint on the this.taskOptionsLoaded line, it is within the store scope, not the controller (this) scope.

What is the cleanest way to add a load callback in a store with it’s own storeId, and execute a method within the scope of the controller?

Hope that makes sense.

Answer 1

If your controller had a config stores: ['AdminTasksOptionStore'], it would generate a getter called getAdminTasksOptionStore().

The fact your storeId is adminTasksOptions doesn’t mean ExtJS will generate getters in a controller; you can, however, do Ext.data.StoreManager.lookup('adminTasksOptions').

You’d need to have in your controller:

stores: ['TaskOption'],

And then in your controller you’ll have the getter getTaskOptionStore().

With regards to your load scope, you are using wrong variables, it should really be:

Ext.getStore('adminTasksOptions').load({
    scope: this,
    params: {'t_id' : this.selectedTaskTemplate},
    callback: function(store, records, success) {
        this.taskOptionsLoaded(store, records, success);
    }
});