PDA

View Full Version : Extending Dataproxy and Reader



udayogra
31 Oct 2012, 1:41 AM
I am trying to upgrade our grid to 4.0 version.
We were using extended proxy as well as reader till now.


I would show the important code snippets

Here is our proxy :

My.ExtProxy = function(bindHandler, errorHandler)
{
this.api =
{
load : true,
create : undefined,
save : undefined,
destroy : undefined
};

My.ExtProxy.superclass.constructor.call(this);
this.bindHandler = bindHandler;
this.errorHandler = errorHandler
};


Ext.extend(My.ExtProxy, Ext.data.DataProxy,
{

// We need this to maintain state for cases where bindOnLoad=false
_cf_firstLoad : true,

load : function(params, reader, callback, scope, arg)
{
//some logic
},

loadResponse : function(data, params)
{
//somelogic
result = params._cf_reader.readRecords(data);
}


},

update : function(dataSet)
{
},

updateResponse : function(dataSet)
{
}
});

Here is our extended Reader :

My.ExtReader = function(colModel)
{
this.recordType = Ext.data.Record.create(colModel);
};


Ext.extend(My.ExtReader, Ext.data.DataReader,
{
readRecords : function(response)
{
//somelogic
return {success:true, records:records, totalRecords:response.TOTALROWCOUNT};
}


});

Here is how we define our DataModel :

datamodel= new Ext.data.Store({proxy:new My.ExtProxy(_cf_CFGRID_getData_1351512215802,null), reader:new My.ExtReader(_cf_gridColModel), remoteSort:true, sortInfo:true});

We can ignore the logic written inside. I just want to know if I am following the correct syntax for extending proxy,reader and defining datamodel.
Because data inside grid is not coming. Its outline is only getting rendered. During debugging I realized even the over-ridden methods in our extended proxy are not getting called. So there has to be something which I am missing

I know the way we extend has changed in 4.0 version, I tried that also but did not help.
I also know reader is now part of proxy and not store. But how to change this code for this

So can any one help?

James Goddard
31 Oct 2012, 4:28 AM
Ext.define ('MyReader', {
extend: 'Ext.data.reader.Reader',
alias: 'reader.myreader',
...
});

Ext.define ('MyProxy', {
extend: 'Ext.data.proxy.Proxy',
alias: 'proxy.myproxy',
...

Ext.define ('MyStore', {
extend: Ext.data.Store',
proxy: {
type: 'myproxy',
reader: {
type: 'myreader'
}
}
...
});

udayogra
1 Nov 2012, 11:57 PM
Thanks for your reply.

But I a, still struggling to get the grid working.

Now apart from the code you suggested this is the grid's code I am trying to execute :

Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
store: ????,
columns: colModel,
width: 400,
height: 125,

renderTo: Ext.getBody()
});

colModel defines all columns
What should come for 'store' attribute.
What I did is created store object like this :
dataModel= Ext.create ('Ext.data.Store', {
proxy: {
type: 'myproxy',
reader: {
type: 'myreader'
}
},
});

and used this 'dataModel' for store attribute. Is it right?

When I execute this code grid is getting rendered without any data.I can see column names but no data.
I have even put breakpoints inside methods of out extended proxy and reader but they are not being invoked.

So what could be the issue?

udayogra
2 Nov 2012, 12:29 AM
Basically function 'load : function(params, reader, callback, scope, arg)' of extended proxy is not being invoked. This method was getting invoked in previous versions. Has the flow changed?

udayogra
2 Nov 2012, 12:33 AM
Ext.data.DataProxy of extjs 3 is same as Ext.data.proxy.Proxy of ext js 4.Dataproxy of extjs 3 had 5 events including 'load'. But latest version has only 1 event.So what changes do I need to make. I can see 'read' method in new Proxy class. Do I need to override that?

James Goddard
2 Nov 2012, 4:45 AM
Well first It sounds like you want to hit the server and do something either before or after the load. First I would extend Ext.data.proxy.Ajax as the base proxy essentially does nothing.

If you want to do something before the load override doRequest then do your thing and call the base. If you want to do something after the load override processResponse then do your thing and call the callback.

udayogra
2 Nov 2012, 7:17 AM
Actually in 3.x version extended proxy had 'load : function(params, reader, callback, scope, arg)' function.
This function had the code of fetching the data from server. This method was getting invoked by extjs framework.

But after upgrading and doing above mentioned changes this method is not getting invoked and hence data is not being fetched.
So do you mean I should do something like this for latest version :

doRequest : function(action, rs, params, reader, callback, scope, options) {

this.load(params, this.reader, callback, scope, options);
},

kevin.chen
6 Nov 2012, 2:47 PM
You did not define data model, data model is a new class is introduced in ExtJs4, it is equivalent to Ext.data.Record in pervious ExtJs, the difference is: you have to explicitly define this class before to use it, in previous ExtJs, Ext.data.Record is automatically created inside reader.

here is an example




Ext.define('Employee', {
extend: 'Ext.data.Model',
fields: [
{name: 'rating', type: 'int'},
{name: 'salary', type: 'float'},
{name: 'name'}
]
});


you store should be defined as following





Ext.create('Ext.data.Store', {
model: 'Employee',
proxy: {
type: 'myproxy',
reader: {
type: 'myreader'
}
},
});



you also have the freedom to put proxy inside model instead of store