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},....]}

就这样完成了前台的数据查询交互;

希望我的例子对各位有用。

时间: 2024-11-04 06:10:27

Extjs分页使用java实现数据库数据查询的相关文章

Java读取数据库数据生成柱状图

此案例是用swing显示数据的.需要引入jfreechart相关包,不同版本可能包不相同,本人用的是 此案例在ssi框架下会报错,不用框架就没问题. Java后台逻辑代码: public class BarChart { ChartPanel frame1; public BarChart() { CategoryDataset dataset = getDataSet(); JFreeChart chart = ChartFactory.createBarChart3D("水果",

Java将数据库数据导入EXCEL

一般的数据库数据怎么导入excel中呢??这让人非常疑惑,今天我找到了一个方法能够实现 须要导入一个第三方包下载地址 详细内容例如以下: 里面含有指导文档,index.html里面含有怎样读取数据库文件到excel和excel数据到数据库中. 主要用到一个包 将这个包复制到项目里面就能够了. 先做一个简单版本号的helloword <span style="white-space:pre"> </span>public void mkexcel() throws

数据库 - 数据查询

数据查询 语句格式 SELECT [ALL|DISTINCT] <目标列表达式> [,<目标列表达式>] - FROM <表名或视图名>[, <表名或视图名> ] - [ WHERE <条件表达式> ] [ GROUP BY <列名1> [ HAVING <条件表达式> ] ] [ ORDER BY <列名2> [ ASC|DESC ] ]: 选择表中的若干列 查询指定列 [例1] 查询全体学生的学号与姓名.

sql server数据库数据查询成功

1 <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> 2 <%@ page import="java.sql.*" %> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q

java 读取数据库数据转化输出XML输出在jsp页面

因为老师实验报告要求,搭建服务端解析XML 下面代码实现转化XML格式也是在网上找的转化代码 输出在jsp页面以便于客户端解析是自己写的 一个类就解决了Test package tests; //三只坚果 import org.w3c.dom.Document; import org.w3c.dom.Element; import org.w3c.dom.Node; import org.apache.crimson.tree.XmlDocument; import javax.xml.pars

Chapter 1. Ado.Net 数据库数据查询(多行、多列)

using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.Data.SqlClient; //引用命名空间 namespace Ado.net数据库增删改查 { class Program { static void Main(string[] args) { //1.数据库连接 SqlConnection conn = new SqlConnection(

java获取数据库数据表的元数据

Connction conn; DatabaseMetaData dmd=conn.getMetaData();//获取数据库元数据 PreparedStatment ps; ps.getParameterMetaData; //得到参数占位符的元数据 ResultSet rs; ResultSetMetaData rsmd=rs.getMetaData();//获取结果集的元数据

50.数据库数据查询例题

截图 表名称以此为course,teacher,class,score,student 代码 calss 表 create table class( cid int primary key auto_increment, caption varchar(20) not null ); insert into class values('1', '三年二班'), ('2', '三年三班'), ('3', '一年二班'), ('4', '二年九班'); teacher表 create table t

JAVA对数据库进行操作,实现数据库中数据的插入,查询,更改,删除操作

(—)通过mysql workbench 创建一个数据库,在这里命名为company,然后建一个tb_employee表 (二)以下是java代码对表tb_employee的操作 1 创建一个Employee类,包括员工的一些信息,如  id  name age sex 2创建DatabaseConnection类,用于数据库的连接 3创建一个EmployeeOperation类,用于操作数据库,它里面包括了 以下方法 (1)getInstance()   //返回EmployeeOperati