Loading a store from controller using Ext.Direct

**abcoa** · 12 Sep 2011 10:55 AM

I tried asking this same question under community forums (under Ext Direct) but after almost 100 views and no replies, I thought I'd re-post under Premium help and see if I have better luck

------------------------------------------------------------------------------------------------
Hi

I have a Ext app (MVC style) that is loading some data in the grid (the view) from store which has the model w/ proxy (type: 'direct') defined...

So I allready know that in my controller I need to add/swap directFn/api for the proxy and then call store.load()....

But how do I pass in parameters to load so that direct function is being called with those parameters?

Here is my model:

Code:

Ext.define('Demo.model.SimpleGrid', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'Id', type: 'int' },
        { name: 'Name', type: 'string' },
        { name: 'Email', type: 'string' },
        { name: 'HireDate', type: 'date', dateFormat: 'c' },
        { name: 'Salary', type: 'float' },
        { name: 'Active', type: 'boolean' }
    ],
    idProperty: 'Id',
    proxy: {
        type: 'direct',
        directFn: Ext.emptyFn,
        paramOrder: 'start|limit|sort|dir',
        paramAsHash: false,
        reader: {
            type: 'json',
            root: 'data'
        }
    }
});

Here is my store:

Code:

Ext.define('Demo.store.SimpleGrid', {
    extend: 'Ext.data.Store',
    model: 'Demo.model.SimpleGrid',
    
    pageSize: 10,
    remoteSort: true,
    
    sorters: [
        {
            property : 'Name',
            direction: 'ASC'
        }
    ]
    
});

Then in my controller (in onLaunch()) I do this:

Code:

var me = this;




// re-define the ext direct function model's proxy should use
me.getSimpleGridModel().getProxy().directFn = Employees.Get;




// load the store - this does not work !!!
me.getSimpleGridStore().load({
    params: {
        start: 0,
        limit: 10,
        sort: 'Name',
        dir: 'ASC'
    }
});

When I inspect the POST from within Firebug I get:

Code:

{"action":"Employees","method":"Get","data":[null,null,null,null],"type":"rpc","tid":1}

However, if in the same method (onLaunch) I call direct function directly it works...

Code:

Employees.Get(0, 10, 'Name', 'ASC', function (result, response) {
    console.log(result);
    console.log(response);
 });

------------------------------------------------------------------------------------------------

thanks a lot!

**jsakalos** · 12 Sep 2011 11:49 PM

You could probably use Ext.Function.bind for that.

**abcoa** · 13 Sep 2011 4:43 AM

I am sorry - use Ext.Function.bind when...??? When "replacing" directFn on model proxy? Or when loading store?
Can you give me an example?

Thanks!

**jsakalos** · 13 Sep 2011 11:04 AM

I do not use Direct personally so I don't have any examples and my answer is quite general. bind allows you to override arguments so if the framework calls directFn w/o arguments but you create a new one with arguments (bind) then arguments will be passed.

**abcoa** · 13 Sep 2011 11:07 AM

I spent almost 2 hrs trying different variations of the bind()....
None worked...

**jsakalos** · 13 Sep 2011 11:11 AM

Try this:

HTML Code:

<!DOCTYPE html>
<!-- function-bind.html -->
<html>
<head>
    <title>Example by Saki</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="ext-4.0.6/resources/css/ext-all.css" type="text/css">
    <link rel="shortcut icon" type="image/png" href="../Icon.png">
    <script type="text/javascript" src="ext-4.0.6/ext-all-debug.js"></script>
    <script type="text/javascript">

    
    // entry point
    Ext.onReady(function() {
        var fOriginal = function(a, b) {
            console.log('a=', a, 'b=', b);
        };

        var fBound = Ext.Function.bind(fOriginal, null, [2,3]);

        fBound();

    }); // eo onReady
    
    </script>
</head>
<body>
</body>
</html>
<!-- eof -->

**abcoa** · 13 Sep 2011 11:36 AM

I tried it - your example works...I even incorporated it into controller...But calling bind on directfn fails saying that fn.directCfg is underfined which is very very unlikely because I called the same function just moment before and it executes fine...

Here is the code snippet from controller

Code:

fOriginal: function (a, b) {
    console.log('a=', a, 'b=', b);
},
onLaunch: function (app) {
        console.log("onLaunch");
        var me = this;
        
        //this works fine
        //this call generates following POST params -> {"action":"Employees","method":"Get","data":[0,10,"Name","ASC"],"type":"rpc","tid":1}
        Employees.Get(0, 10, 'Name', 'ASC', function (result, response) {
                console.log(result);
                console.log(response);
        });
        
        // saki's test...works as expected also...
        me.fOriginal(99, 99);
        var fBound = Ext.Function.bind(me.fOriginal, null, [2, 3]);
        fBound();        
        
        //does not work...
        // I get an error --> fn.directCfg is undefined http://localhost/extjs/ext-all-debug.js Line 52236
        me.getSimpleGridModel().getProxy().directFn = Ext.Function.bind(Employees.Get, null, [0, 10, 'Name', 'ASC']);        
        
}

**jsakalos** · 13 Sep 2011 11:42 AM

Is it called in the right scope? My example sets scope to null you may need to run that function in another scope.

**abcoa** · 13 Sep 2011 11:46 AM

I tried couple options (notably passing "me" -> var me=this //refers to controller)...all gave me the same error...

**germanicus** · 5 Oct 2011 3:29 PM

You've found a bug with the Direct proxy. The problem is that when the paramOrder config is specified as a string, it's split into an array but it's not correctly passed up to its parent as an array (which it must be). I'm going to file a bug. In the meantime, this override will work:

Code:

Ext.override(Ext.data.proxy.Direct, {
    constructor: function(config){                                    
        var me = this;


        Ext.apply(me, config);
        if (Ext.isString(config.paramOrder)) {                            
            config.paramOrder = config.paramOrder.split(me.paramOrderRe); 
        }                                                             
        me.callParent(arguments);                                     
    }
});

Loading a store from controller using Ext.Direct

Thread Tools

Search Thread

Display

Loading a store from controller using Ext.Direct

Loading a store from controller using Ext.Direct

Tags for this Thread