Extjs分页使用Java实现数据库数据查询
关于Ext分 页功能的实现。项目用的是js、Ext、servlet。下面贴下代码： var obj = this; var pageSize = 20; //统计结果分页每一页显示数据条数 //在这里使用Store来创建一个类似于数据表的结构，因为需要远程获取数据，所以应该使用 //HttpProxy类，我是从后台读取的是json数据格式的数据，所以使用JsonReader来解析； 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"， //此处与后台json数据中相对应，为数据的总条数 root:"data" //这里是后台json数据相对应 }，statTime); var store = new Ext.data.Store({ proxy:proxy， reader:reader }); //定义分页工具条 var bbarObj = new Ext.PagingToolbar({ pageSize: pageSize， store: store， width: 300， displayInfo: true， //该属性为需要显示分页信息是设置 //这里的数字会被分页时候的显示数据条数所自动替换显示 displayMsg: '显示第 {0} 条到 {1} 条记录，一共 {2} 条'， emptyMsg: "没有记录"， prependButtons: true }); 在我的项目中使用的是GridPanel来进行显示数据表，所以定义如下： var grid = new Ext.grid.GridPanel({ store: store， columns: [ {header:'序号'，width: 33， sortable: true，dataIndex:'rowNo'，align:'center'}， {id:'gpsid'，header:'GPS编号'，width: 85， sortable: true，dataIndex:'gpsid'，align:'center'}， {header:'警员名称'，width: 90， sortable: true，dataIndex:'policeName'，align:'center'} ]， region:'center'， stripeRows: true， title:'统计表'， autoHeight:true， width:302， autoScroll:true， loadMask:true， stateful: true， stateId: 'grid'， columnLines:true， bbar:bbarObj //将分页工具栏添加到GridPanel上 }); //在以下方法中向后台传送需要的参数，在后台servlet中可以使用 //request.getParameter("");方法来获取参数值； store.on('beforeload'，function(){ store.baseParams={ code: code， timeType: timeType， timeValue: timeValue } }); //将数据载入，这里参数为分页参数，会根据分页时候自动传送后台 //也是使用request.getParameter("")获取 store.reload({ params:{ start:0， limit:pageSize } }); duty.leftPanel.add(grid); //将GridPanel添加到我项目中使用的左侧显示栏 duty.leftPanel.doLayout(); duty.leftPanel.expand(); //左侧显示栏滑出
后台servlet获取前台传输的参数： 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(); 下面讲以下后台将从数据库查询的数据组织成前台需要的格式的json数据串 StringBuffer json = new StringBuffer(); String jsonData = ""; ...... //这里用前台传来的参数进行数据库分页查询 int startNum = new Integer(start).intValue(); int limitNum = new Integer(limit).intValue(); startNum = startNum + 1; limitNum = startNum + limitNum; ...... rs = ps.executeQuery(); //这里的count即是前台创建的数据格式中的数据总数名称，与之对应，data同样 json.append("{count:" + count + "，data:[{"); int i = startNum - 1; //该变量用来设置数据显示序号 while(rs.next()){ i = i + 1; //这里的rowNo与前台配置的数据字段名称想对应，下面同样 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 + "]}"; //组成的json数据格式应该是： //{count:count，data:[{rowNo:rowNo，gpsId:gpsId，policeName:policeName}，....]} 这样完成了前台的数据查询交互； 希望我的例子对各位有用。
