jquery.pagination.js数据无刷新真分页
定义一个全局的分页加载变量,并设置为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数据无刷新真分页的更多相关文章
- ajax分页2:jquery.pagination +JSON 动态无刷新分页
静态页面: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...
- jquery.pagination +JSON 动态无刷新分页
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SqlPage.aspx.cs& ...
- jquery+jquery.pagination+php+ajax 无刷新分页
<!DOCTYPE html> <html ><head><meta http-equiv="Content-Type" content= ...
- input ,button, textarea 1)使用disabled , 2) 显示值, 3) 表单提交. 4) jquery.form.js ajaxSubmit() 无刷新ajax提交表单.
1.使用disabled input , button textarea 可以 被 禁用, 禁用的效果 : 1) 上面的点击事件无法使用 --- button : 下面的 onclick ...
- 无刷新分页 jquery.pagination.js
无刷新分页 jquery.pagination.js 采用Jquery无刷新分页插件jquery.pagination.js实现无刷新分页效果 1.插件参数列表 http://www.dtan.so ...
- ajax分页实现,jquery.pagination.js
1.前台使用ajax无刷新分页,主要需要生成分页的工具条,这里使用的是jquery.pagination.js 插件参数可以参考----张龙豪-jquery.pagination.js分页 下面贴出代 ...
- js jquery.pagination.js分页
1.使用插件为 jquery.pagination.js ,如果没有这个js文件的话,我可以给发个. 首先引用 jquery.pagination.js (分页js),跟pagination.css( ...
- [转]jquery.pagination.js分页
本文转自:http://www.cnblogs.com/knowledgesea/archive/2013/01/03/2841554.html 序言 这一款js分页使用起来很爽,自己经常用,做项目时 ...
- 本篇文章主要是对jquery+ajax+C#实现无刷新操作数据库数据的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
我们知道同步执行和异步执行的区别,为了更好的提高用户的体验,我们都会采用异步方式去处理一些问题,毕竟单线程的同步可能回造成卡死等现象,很不友好,所以可以使用ajax来完成用户的体验,现在我们就来说说如 ...
随机推荐
- QT MVC 模型/视图
1. 模型视图实例一, QFileSystemModel QTreeView ,model/view示例. #include <QApplication> #include <QF ...
- codeforces 460D:Little Victor and Set
Description Little Victor adores the sets theory. Let us remind you that a set is a group of numbers ...
- 分享知识-快乐自己:Liunx-大数据(Hadoop)初始化环境搭建
大数据初始化环境搭建: 一):大数据(hadoop)初始化环境搭建 二):大数据(hadoop)环境搭建 三):运行wordcount案例 四):揭秘HDFS 五):揭秘MapReduce 六):揭秘 ...
- Unity3D之Mesh(二)为三角形添加纹理
一.直接開始上步驟 首先繪製一個三角形 創建一個材質,以便後續使用: 1)材質使用的貼圖 2)上代碼 using UnityEngine; using System.Collections; /* = ...
- HTML5中Modernizr类库的作用和使用
Modernizr 是一个用来检测浏览器功能支持情况的JavaScript 库.通过这个库我们可以检测不同的浏览器对于HTML5特性的支持情况. 使用Modernizr类库和使用其他第三方类库的方法是 ...
- SmartGit(试用期30后),个人继续使用的方法。
在我们做项目的过程中,我们会用到SmartGit这个软件来将本地的MAVEN项目push到国内的码云(https://git.oschina.net)或者是国外的github网站进行项目的管理,这个时 ...
- js和jquery 两种写法 鼠标经过图片切换背景效果
这个是javascript的写法 <img src="res/img/shop-c_32.jpg" alt="" onmouseover="th ...
- 如何在MySQL中查询当前数据上一条和下一条的记录
如果ID是主键或者有索引,可以直接查找: 方法一: 查询上一条记录的SQL语句(如果有其他的查询条件记得加上other_conditions以免出现不必要的错误): select * from tab ...
- Linux-iptables(2)
iptables防火墙可以用于创建过滤(filter)与NAT规则.所有Linux发行版都能使用iptables,因此理解如何配置iptables将会帮助你更有效地管理Linux防火墙.如果你是第一次 ...
- OpenCV——颜色均匀渐变
参考来源: 利用OpenCV生成关于某点的颜色径向均匀渐变图像 // define head function #ifndef PS_ALGORITHM_H_INCLUDED #define PS_A ...