Results 1 to 5 of 5

Thread: Can I define a store with a variable url?

  1. #1
    Sencha User
    Join Date
    Jan 2009
    Location
    Ottawa, ON, Canada
    Posts
    81
    Answers
    6

    Default Answered: Can I define a store with a variable url?

    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:
    Code:
    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):

    Code:
    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

  2. Try this:
    Code:
    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"
                }
            }
        }
    );

  3. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Try this:
    Code:
    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"
                }
            }
        }
    );

  4. #3
    Sencha User
    Join Date
    Jan 2009
    Location
    Ottawa, ON, Canada
    Posts
    81
    Answers
    6

    Default

    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

  5. #4
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Quote Originally Posted by myExtJsUname View Post
    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:
    Code:
    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(){
        }
    });
    Quote Originally Posted by myExtJsUname View Post
    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,...]).

  6. #5
    Sencha User
    Join Date
    Jan 2009
    Location
    Ottawa, ON, Canada
    Posts
    81
    Answers
    6

    Default

    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

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •