定义一个全局的分页加载变量,并设置为true:

  1. var __isReSearch=true;

定义分页的一些数据:

  1. var __PageSize = 10;
  2. var __SearchCondition = { "PageSize": __PageSize, "PageIndex": 0, "SortField": ""};
  3. var __TotalCount;

写一个数据模板:

  1. <script type="text/template" id="CD_DataListTemplate">
  2. <tr>
  3. <td>{a}</td>
  4. <td>{b}</td>
  5. <td>{c}</td>
  6. <td>{d}</td>
  7. <td>{e}</td>
  8. </tr>
  9. </script>

当从服务器加载了数据,进行数据展现和分页展现:

  1. function onSearchSuccess(resultJsonData) {
  2. __TotalCount = resultJsonData.TotalCount;
  3. var pageCount = 0;
  4. pageCount = parseInt(resultJsonData.TotalCount / __SearchCondition.PageSize);
  5. if (resultJsonData.TotalCount % __SearchCondition.PageSize > 0) {
  6. pageCount++;
  7. }
  8. if (resultJsonData.TotalCount > 0) {
  9. var userHtml = "";
  10. $("#tbody").html('');
  11. //debugger;
  12. for (var i = 0; i < resultJsonData.WorkOrderManagerList.length; i++) {
  13. userHtml += $("#tl_WorkOrderManagerInfo").html()
  14. .replace(/{a}/g, resultJsonData.WorkOrderManagerList[i].a)
  15. .replace(/{b}/g, resultJsonData.WorkOrderManagerList[i].b)
  16. .replace(/{c}/g, resultJsonData.WorkOrderManagerList[i].c)
  17. .replace(/{d}/g, resultJsonData.WorkOrderManagerList[i].d)
  18. .replace(/{e}/g, resultJsonData.WorkOrderManagerList[i].e);
  19. }
  20. $("#tbody").html(userHtml);
  21.  
  22. if (__isReSearch) {
  23. //debugger;
  24. $("#xx").show();
  25. $("#xx").page("destroy");
  26. $("#xx").page({
  27. total: resultJsonData.TotalCount,
  28. pageSize: __PageSize,
  29. pageBtnCount: 9,
  30. showFirstLastBtn: true,
  31. firstBtnText: "首页",
  32. lastBtnText: "尾页",
  33. prevBtnText: "上一页",
  34. nextBtnText: "下一页",
  35. loadFirstPage: true,
  36. showInfo: true,
  37. infoFormat: '{start} ~ {end}条,共{total}条',
  38. showJump: false,
  39. jumpBtnText: '确定',
  40. showPageSizes: false,
  41. pageSizeItems: null
  42. }).on("pageClicked", function (event, pageIndex) {
  43. getDataByPage(pageIndex);
  44. });
  45.  
  46. }
  47. } else {
  48. $("#xxx").hide();
  49. $("#tbody").html('');
  50. $("#tbody").html('<tr><td colspan=n>无记录</td></tr>');
  51. }
  52. }

点击分页之后加载数据,但不需要再重刷分页:

  1. function getDataByPage(pageIndex) {
  2. __isReSearch = false;
  3. __SearchCondition.PageIndex = pageIndex;
  4. search(); //这个方法会加载数据并调用onSearchSuccess方法
    }

jquery.pagination.js数据无刷新真分页的更多相关文章

  1. ajax分页2:jquery.pagination +JSON 动态无刷新分页

    静态页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  2. jquery.pagination +JSON 动态无刷新分页

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SqlPage.aspx.cs& ...

  3. jquery+jquery.pagination+php+ajax 无刷新分页

    <!DOCTYPE html> <html ><head><meta http-equiv="Content-Type" content= ...

  4. input ,button, textarea 1)使用disabled , 2) 显示值, 3) 表单提交. 4) jquery.form.js ajaxSubmit() 无刷新ajax提交表单.

    1.使用disabled input , button  textarea 可以 被 禁用, 禁用的效果 : 1) 上面的点击事件无法使用 --- button       : 下面的 onclick ...

  5. 无刷新分页 jquery.pagination.js

     无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...

  6. ajax分页实现,jquery.pagination.js

    1.前台使用ajax无刷新分页,主要需要生成分页的工具条,这里使用的是jquery.pagination.js 插件参数可以参考----张龙豪-jquery.pagination.js分页 下面贴出代 ...

  7. js jquery.pagination.js分页

    1.使用插件为 jquery.pagination.js ,如果没有这个js文件的话,我可以给发个. 首先引用 jquery.pagination.js (分页js),跟pagination.css( ...

  8. [转]jquery.pagination.js分页

    本文转自:http://www.cnblogs.com/knowledgesea/archive/2013/01/03/2841554.html 序言 这一款js分页使用起来很爽,自己经常用,做项目时 ...

  9. 本篇文章主要是对jquery+ajax+C#实现无刷新操作数据库数据的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助

    我们知道同步执行和异步执行的区别,为了更好的提高用户的体验,我们都会采用异步方式去处理一些问题,毕竟单线程的同步可能回造成卡死等现象,很不友好,所以可以使用ajax来完成用户的体验,现在我们就来说说如 ...

随机推荐

  1. Shiro-Permissions 对权限的深入理解

    单个权限 query单个资源多个权限 user:query user:add 多值 user:query,add单个资源所有权限 user:query,add,update,delete user:* ...

  2. MySQL 当记录不存在时insert,当记录存在时update

    MySQL当记录不存在时insert,当记录存在时更新:网上基本有三种解决方法 第一种: 示例一:insert多条记录 假设有一个主键为 client_id 的 clients 表,可以使用下面的语句 ...

  3. director.js实现前端路由

    注:director.js的官网 https://github.com/flatiron/director director.js是什么? 理解:前端的route框架,director.js客户端的路 ...

  4. django学习笔记(三)模型

    1.创建一个django app: python manage.py startapp books 2.validate 命令检查你的模型的语法和逻辑是否正确.一旦你觉得你的模型可能有问题,运行 py ...

  5. 将session存入数据库,memcache的方法

    //存入数据库 <?phpif(!$con = mysql_connect('localhost','root','123456')){    die('连接数据库失败');}$link = m ...

  6. mci播放mp3

    1MIDI的播放---- 乐器数字化接口(MIDI)是由音乐界的一些大公司(包括生产电子音乐合成器的公司)制订的一项协议,后来被计算机产业所采用并成为多媒体音乐文件的标准格式.MIDI文件一般较小,对 ...

  7. Agc019_F Yes or No

    传送门 题目大意 有若干道判断题,其中有$n$道答案是$Yes$,另外$m$道答案是$No$,问题除了答案差异本质相同.这些题一道都不会做,但是事先知道$n$和$m$的数量.每次机器会事先等概率地排列 ...

  8. 洛谷 P1767 家族_NOI导刊2010普及(10)

    题目描述 在一个与世隔绝的岛屿上,有一个有趣的现象:同一个家族的人家总是相邻的(这里的相邻是指东南西北四个方向),不同的家族之间总会有河流或是山丘隔绝,但同一个家族的人不一定有相同姓氏.现在给你岛上的 ...

  9. UOJ#164:【清华集训2015】V

    浅谈区间最值操作与历史最值问题:https://www.cnblogs.com/AKMer/p/10225100.html 题目传送门:http://uoj.ac/problem/164 论文题.论文 ...

  10. 用遗传算法解决TSP问题

    浅谈遗传算法:https://www.cnblogs.com/AKMer/p/9479890.html Description \(小m\)在踏上寻找\(小o\)的路程之后不小心碰到了大魔王\(fat ...