ExtJs 5 -- Setting the proxy for a store - extjs5

Question

I have a Store where I am trying to define its proxy in the constructor, like so:
Ext.define('App.store.LabStore', {
extend: 'Ext.data.Store',
constructor: function(config) {
var prox = new Ext.data.proxy.Ajax();
prox.setUrl('http://server:port/app/labs');
prox.setHeaders({'Content-type': 'application/json'});
prox.setReader({type: 'json',rootProperty: 'departmentList'});
this.setProxy(prox);
this.callParent(arguments);
},
autoLoad: false,
model: 'App.model.Lab'
});
Unfortunately, this won't work. What does work, from my controller, is this:
var labStore = Ext.create("App.store.LabStore");
var url = 'http://server:port/app/labs';
labStore.getProxy().setUrl(url);
labStore.on('load','checkLabs',this);
labStore.load();
I realize that the latter method works and perhaps I should just move on but I do want to try to figure out why I cannot set the proxy in the constructor and/or what I'm doing wrong with that approach.
Thanks in advance!
Frank

Answer 1

There is no need to define proxy in constructor. You can define all your properties in config object like so:
//define model
Ext.define('App.model.Lab', {
extend: 'Ext.data.Model',
fields: [{
name: 'name',
type: 'string'
}, {
name: 'closed',
type: 'bool'
}]
});
//define store
Ext.define('App.store.LabStore', {
extend: 'Ext.data.Store',
model: 'App.model.Lab',
proxy: {
type: 'ajax',
url: 'labs.json',
reader: {
type: 'json',
rootProperty: 'departmentList'
}
},
autoLoad: false
});
//initialize store
var store = Ext.create('App.store.LabStore');
// load data from source
store.load();
Here is a fiddle
or you can pass the proxy config when creating store class, like so:
var store = Ext.create('App.store.LabStore', {
proxy: {
type: 'ajax',
url: 'labs.json',
reader: {
type: 'json',
rootProperty: 'departmentList'
}
}
});
but if you need to do it in a constructor you can:
//define store
Ext.define('App.store.LabStore', {
extend: 'Ext.data.Store',
constructor: function(config) {
config = Ext.applyIf({
proxy: {
type: 'ajax',
url: 'labs.json',
reader: {
type: 'json',
rootProperty: 'departmentList'
}
}
}, config);
this.callParent([config]);
},
autoLoad: false
});
Here is a fiddle

Answer 2

The config parameter is used to initialise the Store. It includes, by default, an undefined proxy. I'd be about 90% sure that it's reseting the proxy during the call to the parent constructor.
Try setting the proxy into the config object instead.
Ext.define('App.store.LabStore', {
extend: 'Ext.data.Store',
constructor: function(config) {
var prox = new Ext.data.proxy.Ajax();
prox.setUrl('http://server:port/app/labs');
prox.setHeaders({'Content-type': 'application/json'});
prox.setReader({type: 'json',rootProperty: 'departmentList'});
config.proxy = prox;
this.callParent(arguments);
},
autoLoad: false,
model: 'App.model.Lab'
});