jquery_easyui_DataGrid分页操作.doc

上午没事抽空做了一个datagrid的入门例子，是结合struts2做的，刚下班了，也闲着没事，就datagrid的再做进一步的开发；进行分页操作另外本人有一个习惯，拒绝转载或者抄袭他人的东西.此外，事例源码尽量完整，哪怕最简单的代码也要写的清楚.先看效果：虽然说是入门的例子，但本人尽量做的详细点，以后会继续更新，部分功能此外，为了后继easyui的学习，做了一个简单的框架：后台采用hibernate2.5+struts2开发：数据库用mysql。红色代码标记注意。model层的数据 Student类package org.easyui.model;import java.util.Date;public class Student private int id;private int age;private String name;private Date birthday;private String className;private char sex;public char getSex() return sex;public void setSex(char sex) this.sex = sex;public int getAge() return age;public void setAge(int age) this.age = age;public Date getBirthday() return birthday;public void setBirthday(Date birthday) this.birthday = birthday;public int getId() return id;public void setId(int id) this.id = id;public String getName() return name;public String getClassName() return className;public void setName(String name) = name;public void setClassName(String className) this.className = className;DAO数据库访问层 接口EasyDao：package org.easyui.dao;import java.util.List;import org.easyui.model.Student;public interface EasyDao public List getStudent(int page,int rows);public int getTotalPages(int rows);接口实现类EasyDaoImpl：package org.easyui.dao;import java.util.List;import org.easyui.model.Student;import org.easyui.util.UtilHibernate;import org.hibernate.HibernateException;import org.hibernate.Session;public class EasyDaoImpl implements EasyDao SuppressWarnings(unchecked)public List getStudent(int page, int rows) List list = null;Session session = UtilHibernate.getSession();try session.beginTransaction();String sql = from Student;list = session.createQuery(sql) .setFirstResult(page-1)*rows) .setMaxResults(rows) .list();session.getTransaction().commit(); catch (HibernateException e) session.getTransaction().rollback();e.printStackTrace();finallyUtilHibernate.closeSession(session);return list;public int getTotalPages() Session session = UtilHibernate.getSession();int total = 0;try session.beginTransaction();String sql = select count(*) from Student;int count = (Integer)session.createQuery(sql).uniqueResult();total =count;session.getTransaction().commit(); catch (HibernateException e) session.getTransaction().rollback();e.printStackTrace();finallyUtilHibernate.closeSession(session);return total;Action层:EasyuiAction1 代码如下package org.easyui;import java.util.ArrayList;import java.util.HashMap;import java.util.List;import java.util.Map;import javax.servlet.http.HttpServletRequest;import erceptor.ServletRequestAware;import org.easyui.dao.EasyDao;import org.easyui.dao.EasyDaoImpl;import org.easyui.model.Student;import com.opensymphony.xwork2.ActionSupport;public class EasyuiAction1 extends ActionSupport implements ServletRequestAwareprivate static final long serialVersionUID = 1L;private HttpServletRequest request;private int total;private List rows;public int getTotal() return total;public List getRows() return rows;public void setTotal(int total) this.total = total;public void setRows(List rows) this.rows = rows;Overridepublic String execute() throws Exception int page =Integer.parseInt(request.getParameter(page);int row = Integer.parseInt(request.getParameter(rows);/接受参数page和rowsEasyDao dao = new EasyDaoImpl();/实例化daothis.total = dao.getTotalPages(); this.rows = new ArrayList();List list = dao.getStudent(page, row);/分页，将数据保存到list中for(int i=0;ilist.size();i+)Student student = list.get(i);/最原始循环方法到到student对象Map map = new HashMap();map.put(id, student.getId();/以键值对的形式保存到map中map.put(sex, student.getSex();map.put(name,student.getName();map.put(age, student.getAge();map.put(birthday, student.getBirthday();map.put(className, student.getClassName(); this.rows.add(map);/循环保存map到list对象this.rows中System.out.println(request.getParameter(page);System.out.println(request.getParameter(rows);return SUCCESS;public void setServletRequest(HttpServletRequest request) this.request = request;struts.xml配置如下： easyDemo1.jsp页面代码如下: base href= easyDemo1.jsp $(function()$(#tt).datagrid(title:datagrid小例子,iconCls:icon-ok,width:500,height:320,pageSize:5,pageList:5,10,15,20,nowrap:false,striped: true,collapsible:true,url:easyAction.action,loadMsg:数据装载中.,sortName:code,sortOrder:desc,remoteSort:false,frozenColumns:field:ck,checkbox:true,columns:title:学号,field:id,width:50,rowspan:2,align:center,title:姓名,field:name,width:60,rowspan:2,align:center,title:性别,field:sex,width:50,rowspan:2,align:center,title:年龄,field:age,width:50,rowspan:2,align:center,title:出生日期,field:birthday,width:120,rowspan:2,align:center,title:班级,field:className,width:100,rowspan:2,align:center,pagination:true,rownumbers:true);$(#tt).datagrid(getPager).pagination(displayMsg:当前显示从from到to共total记录,onBeforeRefresh:function(pageNumber, pageSize)$(this).pagination(loading);alert(pageNumber:+pageNumber+,pageSize:+pageSize);$(this).pagination(loaded);,);/$(#tt).datagrid(url:easyAction.action);); 测试josn数据 测试easyui的DataGrid easyDemo.js代码如下:var xmlhttp;function verify() /创建XMLHttpRequest对象 if(window.XMLHttpRequest) xmlhttp = new XMLHttpRequest(); if(xmlhttp.overrideMimeType) xmlhttp.overrideMimeType(text/xml); else if(window.ActiveXObject) var activerxName = MSXML2.XMLHTTP,Microsoft.XMLHTTP; for(var i=0;iactiverxName.length;i+) try xmlhttp = new ActiveXObject(activerxNamei); break; catch(e) /确认XMLHttpRequest对象是否创建成功 if(!xmlhttp) alert(XMLHttpRequest对象创建失败); return; else xmlhttp.onreadystatechange = callback; xmlhttp.open(POST,easyAction.action?page=1&rows=5,true); xmlhttp.set