PDA

View Full Version : Store/Grid Paging



dedoz
14 Apr 2012, 8:04 AM
Im using Ext.toolbar.Paging a Ext.panel.grid and a Ext.data.Store and model.
Data is loading and displayed correctly in the grid, according to the page and limit params.

My problem is the total count.

i didnt configure proxy totalProperty config, im using its default name "total".
-----
totalProperty : String
Name of the property from which to retrieve the total number of records in the dataset. This is only needed if the whole dataset is not passed in one go, but is being paged from the remote server.
Defaults to: "total"
------

so i return a "total" value in the response JSON, on the metada part

JSON response


{ "type":"rpc",
"tid":6,
"action":"empQuery",
"method":"Select",
"result":[{"id":1,"name":"peter"},{"id":2,"name":"mary"},.................],
"total":274,
"success":true,
"message":"OK"
}



but grid paging bar shows
Page [ 1 ] of 1 Displaying 1 - 25 of 25

and the buttons prev/next are disabled.
It displays the 25 loaded records correctly, is just the total and i guess the buttons depend on that total number.

if it was working properly should say "Displaying 1 - 25 of 274" and buttons next/prev should be enabled.

Do i need to configure the total property even when im using "total" default name ? or im mising something else
im using 4.1rc2

dedoz
14 Apr 2012, 11:44 AM
anyone ? D:
this is a isolated code for above explained problem



// Ext Direct function
Ext.direct.Manager.addProvider({
"url":"php\/router.php",
"type":"remoting",
"actions":{
"empQuery":[
{"name":"Select","len":1}
]
}
});

// A simple model
Ext.define('emp', {
extend: 'Ext.data.Model',
fields: [
{name:'empId' ,type:'int' },
{name:'empRazon' ,type:'string' }
],
idProperty: 'empId',
proxy:
{ type: 'direct',
api:{ read : empQuery.Select}
}
});

// A simple store
Ext.define('empStore', {
extend: 'Ext.data.Store',
model: 'emp',
autoLoad: false
});

// Store instance
var myStore = Ext.create('empStore');

// Grid with paging toolbar
Ext.create('Ext.grid.Panel', {
width : 400, height:600,
store : myStore,
columns: [{header:'Company',dataIndex:'empRazon',flex:1}],
dockedItems: [{
xtype: 'pagingtoolbar',
store: myStore,
dock: 'bottom',
displayInfo: true
}],
renderTo : Ext.getBody()
});

myStore.load();


JSON request


{ "action":"empQuery",
"method":"Select",
"data":[{"page":1,"start":0,"limit":25}],
"type":"rpc",
"tid":1
}

and in the first post is the JSON response.

im trying to follow the source code call between store.load() ill its back but its been a pain D:

dedoz
15 Apr 2012, 1:51 AM
i resolved it tracing all the request in the source code and went to

Ext.data.proyx.Direct


extractResponseData: function(response){
return Ext.isDefined(response.result) ? response.result : response.data;
},

so for Direct at least, the response must come inside a result or data property.
if we need to send back some aditional properties (metadata) then we have to configure the reader root,
i configure it to "data"
so the JSON response must be


{ "type":"rpc",
"tid":11,
"action":"empQuery",
"method":"Select",
"result":{
"data":[ {"id":1,"peter","id":2,"mary"},.........],
"total":274,
"success":true,
"message":"OK"
}
}

now "total" is working

alex873
8 Jun 2012, 7:14 AM
Sorry but i didn't get it were to put it in my code:


extractResponseData: function(response){ return Ext.isDefined(response.result) ? response.result : response.data; },
I need to put it here:


var MyStore= Ext.create('Ext.data.Store', {
model: model,
pageSize: 50,
totalProperty :"",
sorters: ['xxxx'],
groupField: 'xxxx',
proxy: {
type: 'direct',
directFn: url,

extraParams: {
'xxx': xxx,
'yyy': yyy,
'xxx': xxx
}
}
});

Or here:



MyStore.loadPage(1,{
params: {
'xxx': xxx,
'yyy': yyy,
'xxx': xxx
}
});



My result is:

{ "type":"rpc", "tid":11,

action: "Prenotations"
method: "searchFormPren"
result: {data:[{X,Y,Z,…},…],…}

data: [{X,Y,Z..},…]
total: 200

tid: 9
type: "rpc"
}
Total pages work fine but i can't get the grid populated because i think it doesn't readit right.
Thanks