PDA

View Full Version : paging not working with ajax call to servlet



kiriti
17 Dec 2014, 11:14 PM
I am able to retrieve all the records from the database using servlet but unable to perform paging on the same. All the records are displayed on the grid with the paging tool bar showing as 1 of 5 of 54 records but actually it is displaying all the records in the first page, second page and so on....
how do i fix this??


Ext.onReady(function ()
{
var itemsPerPage =5;
var store = Ext.create('Ext.data.Store',{
storeId: 'resultsetstore',
autoload: false,
pageSize:itemsPerPage,
fields:
[
{name: 'firstname', id:'firstname'},
{name: 'email', id:'email'},
{name: 'mobileno', id:'mobileno'}
],
proxy:
{
type:'ajax',
enablePaging: true,
url:'./RetrieveRecords'
},
reader:{type:'json',totalProperty: 'total'}
});
store.load();


Ext.create('Ext.grid.Panel',{
store:store,
layout: 'border',
height:300,
renderTo: Ext.getBody(),
columns:
[
{
header: 'Email',
id: 'email',
dataIndex: 'email',
//autoSizeColumn : true,
flex: 1,
editor: {
xtype: 'textarea'
}
},
{
header: 'Action',
id: 'action',
align: 'center',
xtype: 'actioncolumn',
autoSizeColumn: true,
//flex: 1,
sortable: false,
items:
[
{
icon: 'images/icons/cancel.png',
tooltip: 'Delete',
handler: function (grid, rowIndex, colIndex)
{
var rec = grid.getStore().getAt(rowIndex);
var email = rec.get('email');
Ext.Ajax.request(
{
url: './deleteRecords',
params: {email: email},
method: 'GET',
success: function (response)
{
Ext.Msg.alert("successfully deleted" + " " + response.status);
window.location.reload();
},
failure: function (response)
{
Ext.Msg.alert("failed" + response.status);
}
});
}
}
]
}
],
dockedItems:
[
{
xtype: 'pagingtoolbar',
store: store,
dock: 'bottom',
displayInfo: true
}
]
});
});

aaugen
18 Dec 2014, 12:34 AM
Hi kiriti,
Try to put "buffered" property on your store to true.
Another thing, when you use a paging store, you must configure your serlvet to retrieve specific params like page (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Server-cfg-pageParam), start (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Ajax-cfg-startParam) and limit (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Ajax-cfg-limitParam) generated by proxy to manage page information. You must also include a totalProperty (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.reader.Reader-cfg-totalProperty) (by default total) on your response to set total records on your store.

You can look at the source code for this example:
http://docs.sencha.com/extjs/4.2.3/#!/example/grid/paging.html

kiriti
18 Dec 2014, 1:32 AM
setting buffered to true didn't help. How do I configure page, start and limit parameters in servlet? please help I am new to extjs

kiriti
18 Dec 2014, 1:33 AM
Hi kiriti,
Try to put "buffered" property on your store to true.
Another thing, when you use a paging store, you must configure your serlvet to retrieve specific params like page (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Server-cfg-pageParam), start (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Ajax-cfg-startParam) and limit (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.proxy.Ajax-cfg-limitParam) generated by proxy to manage page information. You must also include a totalProperty (http://docs.sencha.com/extjs/4.2.3/#!/api/Ext.data.reader.Reader-cfg-totalProperty) (by default total) on your response to set total records on your store.

You can look at the source code for this example:
http://docs.sencha.com/extjs/4.2.3/#!/example/grid/paging.html

setting buffered to true didn't help. How do I configure page, start and limit parameters in servlet? please help I am new to extjs

vijay30487
15 Jul 2015, 7:21 AM
Hi Kiriti, I am facing same problem. I am calling paging from ajax request in place of proxy. So how do I get servlet parameter like start, limit?