Easyui实现后台分页功能

servlet访问数据库返回一个list给js,，js中添加一个过滤数据的属性loadFilter，function实现过滤

dao：

package cn.zt.dao;

import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import cn.zt.entity.Teacher;
import cn.zt.util.DBHelper;


public class AllTeacherDao extends DBHelper{
	public List<Map<String, Object>> getAll(int page,int rows){
		List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();  
//		String sql = "select id,teachername,password,tel from teacher limit "+(page-1)*rows+","+page*rows+"";
		String sql = "select id,teachername,password,tel from teacher";
		ResultSet rs = this.executeQuery(sql);
		if(rs!=null){
			try {
				while(rs.next()){
					HashMap<String, Object> map = new HashMap<String, Object>();  
		            map.put("id", rs.getInt("id"));   
		            map.put("teachername", rs.getString("teachername"));  
		            map.put("password", rs.getString("password"));  
		            map.put("tel", rs.getString("tel"));  
		            list.add(map);  
					
				}
			} catch (SQLException e) {
				// TODO 自动生成的 catch 块
				e.printStackTrace();
			}finally {
				this.close();
				
			}
			System.out.print("AllTeacherDao执行");
			return list;
		}else return null;
		
	}
}

servlet:

package cn.zt.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;



import cn.zt.dao.AllTeacherDao;
import cn.zt.entity.Teacher;
import net.sf.json.JSONException;
import net.sf.json.util.JSONStringer;


//@WebServlet("/AllTeacherServlet")
public class AllTeacherServlet extends HttpServlet {

       
@Override
protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

	super.service(req, resp);
	

}
    public AllTeacherServlet() {
        super();
    }


	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		
	}


	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//		AllTeacherDao dao= new AllTeacherDao();
//		List<Teacher> list = dao.getAll();
//		Gson gson=new Gson();
//		String str = gson.toJson(list);
//		System.out.println(str);
//		PrintWriter out = response.getWriter();
//		out.write(str);
		int page=Integer.parseInt(request.getParameter("page"));
		int rows=Integer.parseInt(request.getParameter("rows"));
		System.out.println(page);
		System.out.println(rows);
		AllTeacherDao dao= new AllTeacherDao();
		List<Map<String, Object>> list = dao.getAll(page,rows);  
		JSONStringer stringer = new JSONStringer();  
		 stringer.array();  
		 if(list!=null){
			 for (int i = 0; i < list.size(); i++) {  
		         Map<String, Object> teacherlist= list.get(i);  
		         try {  
		             stringer.object();  
		             Iterator it = teacherlist.keySet().iterator();  //迭代器,返回一个所有key值的迭代遍历
		             while (it.hasNext()) {  
		                 Object key = it.next();  
		                 stringer.key((String) key).value(teacherlist.get(key));  
		             }  
		             stringer.endObject();  
		         } catch (JSONException e) {  
		             // TODO Auto-generated catch block  
		             e.printStackTrace();  
		         }  

		     }  
		 }
	     
	     stringer.endArray();    
	     PrintWriter out = response.getWriter();
	     out.print(stringer.toString());  
//	     out.print("{total:21,pageSize:10,pageNum:1,rows:"+stringer.toString()+"}");
		
		System.out.println("servlet执行");
		

	}

}

js:

$(function(){
	$('#manager').datagrid({
//		url:"http://localhost:8080/HSInteraction/AllTeacherServlet",
		fit:true,
		fitColumns:true,
		striped:true,
		rownumbers:true,
		border:false,
		pagination:true,
		pageSize:20,
		pageList:[10,20,30,40,50],
		pageNumber:1,
		sortName:'data',
		sortOrder:'desc',
		toolbar:'#manager_tool',
		loadFilter: pagerFilter,//DataGrid属性中有一个用于过滤数据的属性loadFilter
	    columns:[[    
	        {field:'id',title:'编号',width:100,checkbox:true},    
	        {field:'teachername',title:'教师名称',width:100}, 
	        {field:'password',title:'密码',width:100},
	        {field:'tel',title:'电话号码',width:100}    
	    ]]    

	});
	//实现分页功能，list为servlet查询的所有json数据
	function pagerFilter(data) {  
	    if (typeof data.length == 'number' && typeof data.splice == 'function') {  
	    	//typeof判断变量类型的，12是数字，所以输出的结果是number
	        data = {  
	            total: data.length,  
	            rows: data  
	        }  
	    }  
	    var dg = $(this);  
	    var opts = dg.datagrid('options');  //返回参数对象
	    var pager = dg.datagrid('getPager');  
	    pager.pagination({  
	        onSelectPage: function (pageNum, pageSize) {  
	            opts.pageNumber = pageNum;  
	            opts.pageSize = pageSize;  
	            pager.pagination('refresh', {  
	                pageNumber: pageNum,  
	                pageSize: pageSize  
	            });  
	            dg.datagrid('loadData', data);  
	        }  
	    });  
	    if (!data.originalRows) {  
	        if(data.rows)  
	            data.originalRows = (data.rows);  
	        else if(data.data && data.data.rows)  
	            data.originalRows = (data.data.rows);  
	        else  
	            data.originalRows = [];  
	    }  
	    var start = (opts.pageNumber - 1) * parseInt(opts.pageSize);  
	    var end = start + parseInt(opts.pageSize);  
	    data.rows = (data.originalRows.slice(start, end));  
	    return data;  
	}    
	
});

 jsp：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
   <script type="text/javascript"src="js/jquery.min.js"></script><!-- jquery全代码 -->
    	
		<script type="text/javascript"src="js/jquery.easyui.min.js"></script><!-- jquery中easyui全代码 -->
		
		<script type="text/javascript"src="js/locale/easyui-lang-zh_CN.js"></script><!-- 当地语言包 -->
		
		<link rel="stylesheet" type="text/css" href="js/themes/default/easyui.css"><!-- easyui全样式 -->
		
		<link rel="stylesheet" type="text/css" href="js/themes/icon.css"><!-- easyui图标样式 -->
		
		<link rel="stylesheet" type="text/css" href="css/teacherlogin.css">
    	<script type="text/javascript" src="js/allteacher.js"></script>
    	<script type="text/javascript">
    	
    	</script>
  </head>
  
  <body>
     <div id="manager_tool" >
	   <div style="height:40px">
		<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" οnclick="add()" style="padding:8;text-align:center;">新增</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" οnclick="edit()" style="padding:8;text-align:center;">编辑</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" οnclick="remove()" style="padding:8;text-align:center;">删除</a>
		<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" οnclick="save()" style="padding:8;text-align:center;">保存</a>
	   </div>
</div>
   <table id="manager" url="AllTeacherServlet"></table>

  </body>
</html>