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

var __isReSearch=true;

定义分页的一些数据:

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

写一个数据模板:

<script type="text/template" id="CD_DataListTemplate">
<tr>
<td>{a}</td>
<td>{b}</td>
<td>{c}</td>
<td>{d}</td>
<td>{e}</td>
</tr>
</script>

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

function onSearchSuccess(resultJsonData) {
__TotalCount = resultJsonData.TotalCount;
var pageCount = 0;
pageCount = parseInt(resultJsonData.TotalCount / __SearchCondition.PageSize);
if (resultJsonData.TotalCount % __SearchCondition.PageSize > 0) {
pageCount++;
}
if (resultJsonData.TotalCount > 0) {
var userHtml = "";
$("#tbody").html('');
//debugger;
for (var i = 0; i < resultJsonData.WorkOrderManagerList.length; i++) {
userHtml += $("#tl_WorkOrderManagerInfo").html()
.replace(/{a}/g, resultJsonData.WorkOrderManagerList[i].a)
.replace(/{b}/g, resultJsonData.WorkOrderManagerList[i].b)
.replace(/{c}/g, resultJsonData.WorkOrderManagerList[i].c)
.replace(/{d}/g, resultJsonData.WorkOrderManagerList[i].d)
.replace(/{e}/g, resultJsonData.WorkOrderManagerList[i].e);
}
$("#tbody").html(userHtml); if (__isReSearch) {
//debugger;
$("#xx").show();
$("#xx").page("destroy");
$("#xx").page({
total: resultJsonData.TotalCount,
pageSize: __PageSize,
pageBtnCount: 9,
showFirstLastBtn: true,
firstBtnText: "首页",
lastBtnText: "尾页",
prevBtnText: "上一页",
nextBtnText: "下一页",
loadFirstPage: true,
showInfo: true,
infoFormat: '{start} ~ {end}条,共{total}条',
showJump: false,
jumpBtnText: '确定',
showPageSizes: false,
pageSizeItems: null
}).on("pageClicked", function (event, pageIndex) {
getDataByPage(pageIndex);
}); }
} else {
$("#xxx").hide();
$("#tbody").html('');
$("#tbody").html('<tr><td colspan=n>无记录</td></tr>');
}
}

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

function getDataByPage(pageIndex) {
__isReSearch = false;
__SearchCondition.PageIndex = pageIndex;
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. 关于ansible变量的一个问题

    ansible-playbook 使用with_items 时 items中 如果有变量 {} 外面可以用 “” items中 如果都是固定值,没有用到变量,{}最外面不要加 “” ,不然报错,mmp

  2. 大话设计模式--状态模式 State -- C++实现实例

    1.状态模式: 当一个对象的内在状态改变时,允许改变其行为,这个对象看起来就像是改变了其类. 状态模式解决的是当控制一个对象状态转换的条件表达式过于复杂, 把状态的判断逻辑转移到表示不同状态的一系列类 ...

  3. Servlet的过滤器(Fliter)

    Servlet过滤器与Servlet十分相似,但具有拦截客户端(浏览器)请求的功能,可以改变请求中的内容来满足实际开发的需求.对于开发人员而言,过滤器实质就是在Web应用服务器上的一个Web应用组件, ...

  4. python第四篇:linux命令行总结 + 自动备份Python程序

    由于最近需要学习Python爬虫相关的知识,所以就先从Python基础.Linux基础开始进行了学习,下面主要是总结了常见的Linux的命令行.最后为了巩固学到的东西,尝试写了个自动备份的Python ...

  5. 关于unity3D的GL图像库的使用

    GL图象库 GL图象库是底层的图象库,主要功能是使用程序来绘制常见的2D与3D几何图形.这些图形具有一定的特殊性,他们不属于3D网格图形,只会以面的形式渲染.使用GL图象库,可在屏幕中绘制2D几何图形 ...

  6. 泛型,注解,反射配合优化BaseDao的猜想

    package test; import java.lang.annotation.Annotation; import java.lang.reflect.Field; import java.la ...

  7. 4_Prototype 原型

    #Prototype ``` // 不好的做法 monster ghost demon sorcerer class Spawner { public: virtual ~Spawner() {} ; ...

  8. 【二叉查找树】01不同的二叉查找树的个数【Unique Binary Search Trees】

    当数组为1,2,3,4,...,n时,基于以下原则构建的BST树具有唯一性: 以i为根节点的树,其左子树由[1,i-1]构成,其右子树由[i+1, n]构成. 我们假定f(i)为以[1,i]能产生的U ...

  9. FFmpeg 基本用法--此文转载,作为笔记

    v  容器(Container) v  容器就是一种文件(封装)格式,比如flv.mkv.ts.mp4.rmvb.avi等.包含下面5种流以及文件头信息. v  流(Stream) v  是一种视频数 ...

  10. 本机不装Oracle,使用plsql连接远程Oracle的方法

    由于Oracle的庞大,有时候我们需要在只安装Oracle客户端如plsql.toad等的情况下去连接远程数据库,可是没有安装Oracle就没有一切的配置文件去支持.最后终于发现一个很有效的方法,Or ...