ExtJS paging using Java to implement database data query

About the implementation of the Ext paging feature. The project is using JS, Ext, servlet. Paste the following code:

var obj = this;
var pageSize = 20; Statistics results pagination Each page shows the number of data bars

Here you use store to create a structure similar to a data table, because you need to get the data remotely, so you should use the
Httpproxy class, I read from the background is the JSON data format data, so use Jsonreader to parse;

var proxy = new Ext.data.HttpProxy ({
URL: "Com.test.check.servlets.QueryDetailServlet"
});
var stattime = Ext.data.Record.create ([
{Name: "RowNo", type: "string", Mapping: "RowNo"},
{Name: "Gpsid", type: "string", Mapping: "Gpsid"},
{Name: "Policename", type: "string", Mapping: "Policename"}
]);
var reader = new Ext.data.JsonReader ({
Totalproperty: "Count",//here corresponds to the background JSON data, the total number of bars in the data
Root: "Data"//This is the background JSON data corresponds
},stattime);
var store = new Ext.data.Store ({
Proxy:proxy,
Reader:reader
});
Define the paging toolbar
var bbarobj = new Ext.pagingtoolbar ({
Pagesize:pagesize,
Store:store,
WIDTH:300,
Displayinfo:true,//This property is required to display paging information is set
The numbers here are automatically replaced by the number of data bars displayed when the page is paged.
Displaymsg: ' shows the {0} to {1} records, altogether {2} ',
Emptymsg: "No Records",
Prependbuttons:true
});

The Gridpanel is used in my project to display the data table, so it is defined as follows:
var Grid = new Ext.grid.GridPanel ({
Store:store,
Columns: [
{header: ' Serial number ', width:33, Sortable:true,dataindex: ' RowNo ', align: ' center '},
{ID: ' Gpsid ', header: ' GPS number ', width:85, Sortable:true,dataindex: ' Gpsid ', align: ' center '},
{header: ' Constable name ', width:90, Sortable:true,dataindex: ' Policename ', align: ' center '}
],
Region: ' Center ',
Striperows:true,
Title: ' Statistics ',
Autoheight:true,
width:302,
Autoscroll:true,
Loadmask:true,
Stateful:true,
Stateid: ' Grid ',
Columnlines:true,
Bbar:bbarobj//Add pagination toolbar to Gridpanel
});
The required parameters are routed to the background in the following ways, which can be used in a background servlet
Request.getparameter (""); method to obtain the parameter value;
Store.on (' Beforeload ', function () {
store.baseparams={
Code:code,
Timetype:timetype,
Timevalue:timevalue
}
});
Load the data, here the parameter is the paging parameter, will automatically transfer the background according to the paging time
Also use Request.getparameter ("") to obtain
Store.reload ({
params:{
start:0,
Limit:pagesize
}
});
Duty.leftPanel.add (GRID); Add Gridpanel to the left display bar used in my project
Duty.leftPanel.doLayout ();
Duty.leftPanel.expand (); Left display bar slide out

Background servlet Gets the parameters of the foreground transport:
Response.setcontenttype ("TEXT/XML;CHARSET=GBK");
String orgId = request.getparameter ("code");
String RangeType = Request.getparameter ("TimeType");
String Rangevalue = Request.getparameter ("TimeValue");
String start = Request.getparameter ("Start");
String limit = Request.getparameter ("Limit");
Statservice ss = new Statservice ();
String json = ss.getstatbyorganization (orgId, RangeType, Rangevalue, start, limit);
PrintWriter out = Response.getwriter ();
Out.write (JSON);
Out.flush ();
Out.close ();

The following is a JSON data string that organizes the data queried from the database into the format that the foreground needs.
StringBuffer json = new StringBuffer ();
String jsondata = "";
......
Here to use the parameters from the front desk for database paging query
int startnum = new Integer (start). Intvalue ();
int limitnum = new Integer (limit). Intvalue ();
Startnum = Startnum + 1;
Limitnum = Startnum + limitnum;
......
rs = Ps.executequery ();
The count here is the name of the total number of data in the data format created by the foreground, which corresponds to
Json.append ("{count:" + Count + ", data:[{");
int i = startNum-1; This variable is used to set the data display sequence number
while (Rs.next ()) {
i = i + 1;
Here the Rowno with the foreground configuration data field names want to correspond, the following same
Json.append ("RowNo: '" + i + "',");
String Gpsid = rs.getstring ("Gpsid");
Json.append ("Gpsid: '" + Gpsid + "',");
String policename = rs.getstring ("Callno");
Json.append ("Policename: '" + policename + "',");
Json.append ("},{");
}
Jsondata = json.substring (0, Json.length ()-2);
Jsondata = Jsondata + "]}";
The JSON data format that is composed should be:
{count:count,data:[{rowno:rowno,gpsid:gpsid,policename:policename},....]}

This completes the foreground data query interaction;
I hope my example will be useful to you.

ExtJS paging using Java to implement database data query