PDA

View Full Version : Can I define a store with a variable url?



myExtJsUname
14 Sep 2012, 1:56 PM
I have a large number of services that all respond to a given request using the same model. I would like to define a single store that I can use for all of them, setting the url in the proxy part dynamically. Can I do that? Or is my approach for this wrong?

To illustrate, the following Store definition works fine for all the services, when the url is hard-wired:

Ext.define(
"my.store.Layers"
,{
extend: "Ext.data.Store"
,uses: [
"my.model.Layers"
]
,model: "my.model.Layers"
,proxy: {
type: "jsonp"
,url: "http://mydomain.com/service1" // or http://mydomain.com/service2, etc.
,reader: {
type: "json"
,root: "layers"
}
}
}
);

I thought I could just pass the url value into the constructor of the store with the config, as below, but it's not happy with this approach (I get a "url.indexOf is not a function" message from urlAppend):


Ext.define(
"my.store.Layers"
,{
extend: "Ext.data.Store"
,uses: [
"my.model.Layers"
]

,constructor: function(config){
this.initConfig(config);
this.callParent([config]);
}

,model: "my.model.Layers"
,proxy: {
type: "jsonp"
,url: this.config.url
,reader: {
type: "json"
,root: "layers"
}
}
}
);

var store = Ext.create(
"my.store.Layers"
,{
url: "http://mydomain.com/service1"
}
);

Is there a different way I should be trying to implement this type of thing? If so, can anyone provide a clue what I should be looking into instead?

I am using ExtJs 4.1.1.

Cheers,
jtm

vietits
14 Sep 2012, 3:25 PM
Try this:


Ext.define(
"my.store.Layers"
,{
extend: "Ext.data.Store"
,uses: [
"my.model.Layers"
]

,constructor: function(config){
// this.initConfig(config);
var me = this;
me.proxy.url = config.url;
delete config.url;
me.callParent([config]);
}

,model: "my.model.Layers"
,proxy: {
type: "jsonp"
// ,url: this.config.url
,reader: {
type: "json"
,root: "layers"
}
}
}
);

myExtJsUname
17 Sep 2012, 6:47 AM
Thank you, vietits !! That's the ticket!

Although, if you have a moment, I hope you can answer a couple of questions regarding your suggested code. If you don't, no worries; you've already done enough.

1. Why the introduction of "var me" and not just "this.proxy.url = config.url"? I ask this because I have seen each used in various code samples and haven't been able to identify a difference at run time between them. Is it coding convention or is there a more important difference that I'm missing?

2. In re: "this.callParent([config]);" I have seen that line of code as well as "this.callParent(arguments);" throughout the ExtJs code. Similar to my above question, is there a difference, practically-speaking? They seem to have the same effect.

Again, thanking you for your suggestion,
jtm

vietits
17 Sep 2012, 5:23 PM
1. Why the introduction of "var me" and not just "this.proxy.url = config.url"? I ask this because I have seen each used in various code samples and haven't been able to identify a difference at run time between them. Is it coding convention or is there a more important difference that I'm missing?

It's a habbit. However, it's a good habbit that you should follow.

In your case, using this or me are the same. However, in some cases, using this can cause some confusion because of scoping. this always reflects the current executing scope, while in some cases you want to run the same code in other scope. With me, you always mean the specific scope of execution regardless the scope of execution.

In some cases, using this or me are the same. However, to keep your code consistent, you should follow one way of coding.

Example:


Ext.define('MyGridPanel', {
extend: 'Ext.grid.Panel',
...
initComponent: function(){
var me = this; // in this scope. 'this' reflects grid instance
me.callParent(arguments); // call parent method with the same arguments
me.getStore().on({
load: function(){
// in this scope, 'this' reflect store instance if you don't specify scope option.
this.sort(...) // do something with store instance
// However, me always refers to grid instance.
me.onStoreLoad(...); // call grid method
}
});
},
onStoreLoad: function(){
}
});




2. In re: "this.callParent([config]);" I have seen that line of code as well as "this.callParent(arguments);" throughout the ExtJs code. Similar to my above question, is there a difference, practically-speaking? They seem to have the same effect.

If you want to call callParent() with the same arguments you should use me.callParent(arguments) syntax. This way is more flexible then me.callParent([argv1, argv2,...]). Ex: if because of some reason you have to change argument list, you don't have to modify me.callParent(arguments), but you have to change me.callParent([argv1, argv2,...]) syntax.

In some cases, if the arguments passed to callParent() are not the same as the arguments of the current called method, then you should use me.callParent([argv1, argv2,...]).

myExtJsUname
18 Sep 2012, 6:46 AM
Ah, I understand now.

Thank you so much for taking the time to answer my questions, vietits; as well as for your help with my original problem. All is working as desired.

Cheers,
jtm