extjs4 - paging in extjs 4 grid is not working -
items per page has been set 10 , have created paging toolbar xtype in docked items in front end.
there's no start , limit parameters in oracle query. how go fetching records oracle database
please help!
here code:
ext.loader.setconfig({enabled: true}); ext.loader.setpath('ext.ux', 'ux/'); ext.require(['*']); ext.onready(function() { var itemsperpage = 10; var store=ext.create('ext.data.store', { autoload: true, autosync: true, pagesize: itemsperpage, data: [], fields: [ {name: 'firstname', id:'firstname'}, {name: 'email', id:'email'}, {name: 'mobileno', id:'mobileno'} ] }); var panel = ext.create('ext.grid.panel', { layout: 'fit', store:store, id: 'grid1', dockeditems: [ { xtype: 'pagingtoolbar', store:store, dock:'bottom', displayinfo:true } ], renderto: ext.getbody(), columns: [ { header:'firstname', id:'firstname', dataindex:'firstname', //autosizecolumn : true, flex: 1, editor: { xtype: 'textarea' } }, { header:'action', id:'action', align:'center', xtype:'actioncolumn', autosizecolumn : true, //flex: 1, sortable:false, items: [ { icon:'images/view_icon.gif', tooltip:'view', handler: function(grid,rowindex,colindex) { var rec= grid.getstore().getat(rowindex); var email=rec.get('email'); location.href="registrationformgridview.jsp?email="+email; } }, { icon:'images/edit_icon.gif', tooltip:'edit', handler: function(grid,rowindex,colindex,e) { var rec= grid.getstore().getat(rowindex); var email = rec.get('email'); location.href="getrecords.jsp?email="+email; // alert(json.stringify(rec.get('email'))); // window.location='getformdata?key1='+email; } }, { 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); } }); } } ] } ], listeners: { afterrender:function() { ext.ajax.request( { params:{email:email}, url:'./retrieverecords', success: function(response) { data = []; data = ext.json.decode(response.responsetext); ext.getcmp('grid1').getstore().loaddata(data); }, failure: function(response) { } }); } } }); });
you have handle paging @ server side, ext js provides neccsary things need paging.
for every click on next or previous ,ext js automatically sends 2 parameters start , limit start next index of last reocord of page , limit(itemsperpage) number of records per page.
for example assume have 100 records , have implemented paging in grid , items per page 10.
intially start =0 , limit 10 ,if click next , start 11 , limit 10 .. similaryly if click previous start 0 , limit 10
using these 2 parameters have frame query loading records , send records response .
Comments
Post a Comment