1、用datagrid 做分页显示， 依据API样例，最终解决。废话不说，datagrid分页 有一个附加的分页控件 通过在datagrid中设置pagination:true 就会显示分页 当请求是 后台会通过 获取page 获取当前页 依据rows每页显示条数

返回格式 {"total":486,"rows":[{"age":10,"email":"lqi@sina.com","id":1,"name":"张三","sex":"男"}]}

total 总条数不能改 rows 数据 查询出来的list

2、数据库数据

3、看效果如图：

4、html代码

<!DOCTYPE html>

<html>

	<head>

		<meta charset="utf-8">

		<title></title>

			<link rel="stylesheet" type="text/css" href="css/themes/default/easyui.css">

	<link rel="stylesheet" type="text/css" href="css/demo.css">

	<link rel="stylesheet" type="text/css" href="css/themes/icon.css">

	<script type="text/javascript" src="js/jquery.min.js"></script>

	<script type="text/javascript" src="js/jquery.easyui.min.js"></script>

	<script type="text/javascript" src="js/easyui-lang-zh_CN.js"></script>

	</head>

	<body>

<table id="dg" class="easyui-datagrid" style="width:100%;">

</table>

 <script type="text/javascript">

    $('#dg').datagrid({

        url:'http://localhost:8080/easyui/TestData',//数据请求地址

       toolbar:'#toolbar',// 数据网格工具栏 比方加入 改动

       pagination:true,//分页显示

       fitColumns:true,//自己主动适应宽度

       autoRowHeight:true,//自己主动行高度

       loadMsg:'正在载入数据请稍后...',

       nowrap:true,//设置为true 有利于提高性能

       idField:'id',//字段标识

       rownumbers:true,//显示行号

       singleSelect:true,//仅仅同意选择一行

       //pageNumber:1,//初始化页面数量

       pageSize:20,//初始化显示条数

       pageList:[20,40,60],//分页列表

        columns:[[

            {field:'id',title:'id',width:100},

            {field:'name',title:'name',width:100},

            {field:'email',title:'email',width:100,align:'center'}

        ]]

    });

   	/*

   	这里多多两句通过例如以下參数可获取一些分页数据

   		var opts=$('#dg').datagrid('options');

   		//获取当前页

   	   var page_Number = opts.pageNumber;   //pageNumber为datagrid的当前页码

          	//获取每页显示的条数

   	   var page_Size = opts.pageSize;

   	 */

    </script>

</body>

</html>

5、servlet类

import java.io.IOException;

import java.io.Writer;

import java.util.HashMap;

import java.util.List;

import java.util.Map;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

import net.sf.json.JSONObject;

/**

 * Servlet implementation class TestData

 */

public class TestData extends HttpServlet {

	private static final long serialVersionUID = 1L;

	/**

	 * @see HttpServlet#HttpServlet()

	 */

	public TestData() {

		super();

		// TODO Auto-generated constructor stub

	}

	/**

	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse

	 *      response)

	 */

	protected void doGet(HttpServletRequest request,

			HttpServletResponse response) throws ServletException, IOException {

		// TODO Auto-generated method stub

		doPost(request, response);

	}

	/**

	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse

	 *      response)

	 */

	protected void doPost(HttpServletRequest request,

			HttpServletResponse response) throws ServletException, IOException {

		response.setContentType("application/json");

		response.setCharacterEncoding("UTF-8");

		response.setHeader("Cache-Control", "no-cache");

		// 获取前台页数

		int page = Integer.parseInt(request.getParameter("page"));

		// 获取前台每页显示条数

		int row = Integer.parseInt(request.getParameter("rows"));

		List<Userinfo> list = JDBCUtil.query(page, row);

		Map<String, Object> jsonMap = new HashMap<String, Object>();// 定义map

		jsonMap.put("total", JDBCUtil.queryCount());// total键 存放总记录数。必须的

		jsonMap.put("rows", list);// rows键 存放每页记录 list

		// 格式化result 一定要是JSONObject

		String result = JSONObject.fromObject(jsonMap).toString();

		System.out.println(result);

		Writer out = response.getWriter();

		out.write(result);

	}

}

源代码下载地址：http://download.csdn.net/download/itlqi/8868529

easyui 分页实现的更多相关文章

  1. 【技巧】EasyUI分页组件pagination显示项控制

    我们使用easyui分页时,分页组件显示项有很多,默认如下是这样的: 有时候我们并不想显示这么多控制项,我们可以通过属性来控制:如下来自EasyUI官网: 如下写法,在datagrid中使用,如下控制 ...

  2. easyui分页的使用方法

    使用: $("#tt").datagrid("getPager").pagination(option); 例子: $("#tb").dat ...

  3. MVC 使用Jquery EasyUI分页成功

    先上图吧

  4. 后台使用oracle前台使用easyui分页机制

    前台easyui 的datagrid中设置分页属性: pagination:true,//显示分页 pagePosition:'bottom',//分页栏位置 both 上下 bottom.top p ...

  5. easyUI分页实现加搜索功能

    前台页面: js代码: ps:pagination为true时会在table下面加上easyUI的分页. load函数会将查询值传给datagrid并传给后台重新加载. DAO.xml为: 后台代码实 ...

  6. (转)EasyUI 分页总结

      最近用到了easyui的分页和搜索栏功能,使用过程中由于运用不熟练导致其间也出现过一些问题,下面做个小结,供大家共同学习.1.首先使用EasyUI 的DataGrid分页,得加载其js类库:< ...

  7. EasyUI 分页 简洁代码

    做分页代码,看到网上很多人实现的方法,那是各种调用,各种获取对象.我很不解,因为Easyui已经给我们了分页的具体实现,为什么有些人要画蛇添足呢. 其实真正的分页,在你的代码中,别人可能都没有注意到, ...

  8. 关于easyUI分页

    首先前台会传来两个参数,分别是rows(一页数据的大小,即一页有多少条数据)和page(第几页),根据这两个参数可以计算出从数据库中从第几 条数据开始取和要取多少条数据.数据取出来后,因为easyUI ...

  9. Struts2与easyui分页查询

    easyui里面分页查询:在easyui框架里面已经进行一些分装,所以我们只要进行后台分页查询即可 web.xml和struts.xml文件的配置的就不需要我多说了,和分页前代码一样,不需要更改: 需 ...

随机推荐

  1. c - 折半查找(二分法检索)

    #include <stdio.h> #define LEN 10 /* 折半查找(二分法检索). */ int index_of(int *a, int k) { ; ; int m; ...

  2. 安卓开发入门之activity

    安卓开发主要用到的是java语言,对于一个activity,自己写的程序可以继承至Activity,该Activity先会运行一个叫 onCreat()的类,可以在其中申明一些初始化的函数等,这个函数 ...

  3. 解决Eclipse中编辑xml文件的智能提示问题，最简单的是第二种方法。

    Eclipse for Android xml 文件代码自动提示功能,介绍Eclipse 编辑器中实现xml 文件代码自动智能提示功能,解决eclipse 代码提示失效.eclipse 不能自动提示. ...

  4. 10 款强大的JavaScript图表图形插件推荐

    转自:http://www.iteye.com/news/24535 网上有很多用于绘制图表图形的免费JavaScript插件和图表库,这类插件大量出现的原因,一是人们不再依赖于Flash,二是浏览器 ...

  5. nginx 伪静态大于10个参数 $10

    伪静态大于10个参数   会解析成 $1   与 0 参考:http://zhidao.baidu.com/link?url=kT2tp8ARhIZsrt4XF3LdzjkEq0QTIbvhOj9Ck ...

  6. java jdbc 连接mysql 数据库

    JDBC连接MySQL 加载及注册JDBC驱动程序 Class.forName("com.mysql.jdbc.Driver"); Class.forName("com. ...

  7. Flask学习记录之Flask-Login

    Flask-Loging 可以方便的管理用户会话,保护路由只让认证用户访问 http://flask-login.readthedocs.org/en/latest/ 一.初始化Flask-Login ...

  8. 关于几种常用的Adapter使用区别

    Adapter常用的实现类如下: 1.ArrayAdapter:简单.易用的Adapter,通常用于将数组或List集合的多个值包装成多个列表项. 2.SimpleAdapter:并不简单.功能强大的 ...

  9. Linux 下 将使用Python-Django开发的web应用布置到服务器上(亲测有效)

    写在前面: Django是一个卓越的新一代Web框架,相信使用Python的人对此并不陌生,但将我们完成的web应用布置到到服务器上并不是一件容易的事情. Django详细的教程可以参考http:// ...

  10. gets与scanf

    gets与scanf 从功能上可以看出不同之处:1 终止条件不同: gets只有遇到\n时才会结束输入,而scanf遇到空格或制表符时,也会结束输入.比如输入"test string\n&q ...