Cannot access correct scope within controller

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.

Izhaki · Accepted Answer · 2012-08-11T13:30:36.057

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);
    }
});

edited Aug 11 '12 at 13:30

answered Aug 11 '12 at 13:14

Izhaki

23,372
9
69
107

As a side comment (and a matter of style), I'll be a bit more attentive with plurals - is it TaskOption or TasksOptions? If the store represent what options a task might have, I'd say it is correct to call it `TaskOptions`. – Izhaki Aug 11 '12 at 13:14
Fixing scope in my `load` function worked. Thanks! I had this set in my controller: `stores: ['admin.TaskOption'],`. Based on how I named my store, should it be `AdminTasksOption` or `TaskOption`? You had it listed two different ways. I use the store manager if I have two separate instances of the same store, but mostly try and use the getter. – Nathan Aug 11 '12 at 14:11
Yes I agree on the naming too. Thanks. – Nathan Aug 11 '12 at 14:12
This didn't work `stores: ['AdminTaskOption'],`. It tried to load `/js/app/store/AdminTaskOption` when the correct path is `/js/app/store/admin/TaskOption`. I can never get the setup right when using subfolders. Which is why I have been using storeId's on any store in a subfolder, then using `Ext.getStore();` – Nathan Aug 11 '12 at 14:16
OK I had this correct the first time `stores: ['admin.TaskOption'],`. `this.getAdminTaskOptionStore()` returns the correct store. Adding a listener like I did originally didn't work. – Nathan Aug 11 '12 at 14:19

score 0 · Answer 2 · answered Aug 11 '12 at 12:30

0

I think you're using on() function wrong. Try this:

this.getAdminTasksOptionStore().on(
  'load', // event
  this.taskOptionsLoaded, // handler
  this // scope
);

answered Aug 11 '12 at 12:30

sha

17,824
5
63
98

Cannot access correct scope within controller

2 Answers2