ExtJs4.2应用：ExtJs4.2+Mysql+Struts2+Hibernate3实现分页查询
ExtJs4.2应用：ExtJs4.2+Mysql+Struts2+Hibernate3
实现分页查询
1.demo简介
这是一个由ExtJs4.2,Mysql5.5 ,Struts2,Hibernate3.3构成的简单web项目，本人由于最近在研究ExtJs所以特意做了这个Demo，方便有需要的同学查看，也给自己留下学习笔记吧。需要特别说明我这里并没有整合Struts，Hibernate，这两个工具是独立运行的。转载请注明：http://blog.csdn.net/qiuzhping/article/details/41739017
1.1 项目目录结构：
1.2 struts.xml配置文件内容
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<include file="struts-default.xml" />
<package name="json" namespace="/" extends="json-default">
<action name="JobData" class="com.qiuzhping.report.action.GetJobDataAction">
<result type="json" />
</action>
</package>
</struts>
1.3 hibernate.cfg.xml配置文件内容
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE hibernate-configuration PUBLIC
"-//Hibernate/Hibernate Configuration DTD 3.0//EN"
"http://hibernate.sourceforge.net/hibernate-configuration-3.0.dtd">
<!-- Generated by MyEclipse Hibernate Tools. -->
<hibernate-configuration>
<session-factory>
<property name="dialect">
org.hibernate.dialect.MySQLDialect
</property>
<property name="connection.url">
jdbc:mysql://localhost:3306/devDB
</property>
<property name="connection.username">root</property>
<property name="connection.password">1234</property>
<property name="connection.driver_class">
com.mysql.jdbc.Driver
</property>
<property name="myeclipse.connection.profile">
mysqlConn
</property>
<mapping resource="com/qiuzhping/report/domian/Job.hbm.xml" />
<mapping resource="com/qiuzhping/report/domian/Sex.hbm.xml" />
<mapping
resource="com/qiuzhping/report/domian/Department.hbm.xml" />
</session-factory>
</hibernate-configuration>
1.4 web.xml配置文件内容
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
2.核心代码展示
2.1 Mysql 分页查询语句
public List<Job> getData(int start,int end,Class clazz){
Session session = hsf.getSessionFactory().openSession();
StringBuffer sql = new StringBuffer("SELECT * FROM job LIMIT "+start+","+end);
SQLQuery query =session.createSQLQuery(sql.toString());
query.addEntity(clazz);
return query.list();
}
2.2 统计总体数量查询语句
public BigDecimal getTotalCount(Class clazz){
Session session = hsf.getSessionFactory().openSession();
StringBuffer sql = new StringBuffer("SELECT * FROM job ");
SQLQuery query =session.createSQLQuery(sql.toString());
query.addEntity(clazz);
return new BigDecimal(query.list().size());
}
2.3 jobenquiry.js内容
var itemsPerPage = 20;
var params;
var store = Ext.create('Ext.data.Store',{
fields:["id","firstName","lastName","loginName","telephone","brithday","sexId","depId"],
proxy:{
type:'ajax',
url:'/demo/JobData.action',
reader:{
type:'json',
root:'rootData',
totalProperty: 'totalCount'
}
},
pageSize: itemsPerPage,
autoLoad:true
});
Ext.onReady(function(){
Ext.Loader.setConfig({
enabled:true
});
Ext.create('Ext.grid.Panel',{
title:'Job Enquiry',
width:'100%',
layout:"auto",
style:"margin-left:auto;margin-right:auto;",
renderTo:Ext.getBody(),
columns:[{
header:'Id',
flex: 1,align:"center",
dataIndex:'id',
sortable:true
},{
header : "First Name",
flex: 1, align:"center",
dataIndex : 'firstName',
sortable : true
}, {
header : "Last Name",
flex: 1, align:"center",
dataIndex : 'lastName',
sortable : true
}, {
header : "Login Name",
flex: 1,
align:"center",
dataIndex : 'loginName',
sortable : true
}, {
header : "Telephone",
flex: 1,align:"center",
hideable: false,
dataIndex : 'telephone',
sortable : true
}, {
header : "brithday",
flex: 1, align:"center",
dataIndex : 'brithday',
sortable : true
}, {
header : "Sex Id",
flex: 1, align:"center",
dataIndex : 'sexId',
sortable : true
}, {
header : "Dep Id",
flex: 1, align:"center",
dataIndex : 'depId',
sortable : true
}],
store:store,
//style:"margin-left:auto;margin-right:auto;align:center",
pageSize: itemsPerPage,
dockedItems: [{
xtype: 'pagingtoolbar',
store: store,
dock: 'bottom',
displayInfo: true
}]
});
store.load({params:{start:0,limit:itemsPerPage}});
var startTime;
var endTime;
function checkDate(){
startTime = Ext.getCmp("startTime");
endTime = Ext.getCmp("endTime");
if(startTime != null && endTime != null && startTime.getValue() > endTime.getValue()){
alert("Start time must be smaller than the end time!");
return false;
}
return true;
}
function query(){
//check date
if(!checkDate()){
return ;
}
params = {
'conEnquiryTicketVo.startTime':startTime.getValue(),
'conEnquiryTicketVo.endTime':endTime.getValue(),
start:0,
limit:itemsPerPage
};
// store.on('beforeload',function(){
// var startTime = Ext.getCmp("startTime");
// var endTime = Ext.getCmp("endTime");
// //alert("click!!"+startTime.getValue());
// params = {
// 'conEnquiryTicketVo.startTime':startTime.getValue(),
// 'conEnquiryTicketVo.endTime':endTime.getValue(),
// start:0,
// limit:itemsPerPage
// };
// });
store.load({params:params});
}
});
2.4 GetJobDataAction内容
package com.qiuzhping.report.action;
import java.math.BigDecimal;
import java.util.List;
import org.apache.log4j.Logger;
import com.opensymphony.xwork2.ActionSupport;
import com.qiuzhping.report.dao.impl.DepartmentDaoImpl;
import com.qiuzhping.report.domian.Job;
/**
* <Description functions in a word>
* <Detail description>
*
* @author Qiuzhenping
* @version [Version NO, 2014-12-5]
* @see [Related classes/methods]
* @since [product/module version]
*/
public class GetJobDataAction extends ActionSupport{
/**
*serialVersionUID
*/
private static final long serialVersionUID = 3288957476157165689L;
private Logger log = Logger.getLogger(this.getClass());
private BigDecimal totalCount;
private List rootData;
private int start;
private int limit;
public BigDecimal getTotalCount() {
return totalCount;
}
public void setTotalCount(BigDecimal totalCount) {
this.totalCount = totalCount;
}
public List getRootData() {
return rootData;
}
public void setRootData(List rootData) {
this.rootData = rootData;
}
public int getStart() {
return start;
}
public void setStart(int start) {
this.start = start;
}
public int getLimit() {
return limit;
}
public void setLimit(int limit) {
this.limit = limit;
}
@Override
public String execute(){
try {
DepartmentDaoImpl ddi = new DepartmentDaoImpl();
log.info("start = "+start);
log.info("limit = "+limit);
int end = start+limit;
log.info("end = "+end);
totalCount = ddi.getTotalCount(Job.class);
rootData = ddi.getData(start, limit,Job.class);
} catch (Exception e) {
log.error(e);
}
return SUCCESS;
}
}
3.效果图
4.源代码（除开Ext库，libs文件）
ExtJs4.2+Mysql+Struts2+Hibernate3实现分页查询
1.libs目录缺少hibernate核心jar包
2.libs目录缺少struts jar
3.WebRoot目录缺少ExtJs4.2核心类库
以上信息我都在项目里面注明了，因为这些内容的文件太大了，CSDN不允许上传，而且也很容易找到，只要按照我在项目内提示的内容去增加这些依赖文件这个项目就能 正常运行。
ExtJs4.2+Mysql+Struts2+Hibernate3实现分页查询 ： http://download.csdn.net/detail/qiu_11/8226457