基于jquery的分页控件(C#)


Posted in Javascript onJanuary 06, 2011

JS代码:
Code:

var _MaxPageSize = 0; 
var _PageSize = 5; 
var _IsUpDown = false; 
function InitPage(funName, currentPageSize, maxPageSize, pageSize, isUpDown) { 
_FunName = funName; 
_CurrentPageSize = currentPageSize; 
_MaxPageSize = maxPageSize; 
_PageSize = pageSize; 
_IsUpDown = isUpDown; 
} 
function ShowPage(objDiv) { 
var strResult = ""; 
var size = Math.floor(_PageSize / 2); 
var maxSize = _CurrentPageSize + size > _MaxPageSize ? _MaxPageSize : _CurrentPageSize + size; 
var minSize = _CurrentPageSize - size < 1 ? 1 : _CurrentPageSize - size; 
if (maxSize == _MaxPageSize) 
minSize = maxSize - _PageSize + 1; 
if (minSize == 1) 
maxSize = minSize + _PageSize - 1; 
var str = ""; 
for (var i = 0; i < _MaxPageSize; i++) { 
var curPage = i + 1; 
if (curPage == 1 || (curPage >= minSize && curPage <= maxSize) || curPage == _MaxPageSize) { 
var strPage = ""; 
if (curPage == minSize && (_CurrentPageSize > _PageSize || minSize > 2)) 
strPage += "... "; 
if (_CurrentPageSize == curPage) { 
strPage += "   <a href='#' style='font-size:14px;color:red'>" + curPage + "</a>"; 
} 
else { 
strPage += "  <a href=\"#\" style='font-size:14px' onclick=\"" + _FunName + "(" + curPage + ");\">" + curPage + "</a>"; 
} 
if (curPage == maxSize && _MaxPageSize - _CurrentPageSize - 1 > size) { 
strPage += "... "; 
} 
strResult += strPage; 
} 
} 
strResult += ""; 
if (_IsUpDown) { 
if (_CurrentPageSize == 1) 
strResult = "<a href='#' >上一页</a>" + strResult; 
else 
strResult = "   <a href=\"#\" onclick=\"" + _FunName + "(" + (_CurrentPageSize - 1) + ");\">上一页</a>" + strResult; 
if (_CurrentPageSize == _MaxPageSize) { 
strResult = strResult + "  <a>下一页</a></ul>"; 
} 
else { 
strResult = strResult + "   <a href=\"#\" onclick=\"" + _FunName + "(" + (_CurrentPageSize + 1) + ");\">下一页</a>"; 
} 
} 
document.getElementById(objDiv).innerHTML =strResult; 
}

HTML Code:
<script src="js/PageViewJS.js" type="text/javascript"></script> 
<script language="javascript" type="text/javascript"> 
function GetCurPage(curPage) { 
//取当前页信息 
document.forms[0].action = "ChrisBlessingList.aspx?Page=" + curPage; 
document.forms[0].submit(); 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div style="width: 1002px; margin: 0 auto;"> 
<div id="hdgz"><img src="images/sdzt_07.jpg" border="0" usemap="#Map" /></div> 
<div id="liebiao"> 
<div class="a_01" id="Container"> 
<ul class="lb"> 
<asp:DataList ID="ddlBlessingList" runat="server" Width="100%"> 
<ItemTemplate> 
<li class="bg01"> 
<table width="700" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="100" height="90" rowspan="2"> 
<img src="images/sdzt_02/img.jpg" class="lb_img" /> 
</td> 
<td width="600" align="left" valign="middle" class="font_07"> 
<%#Eval("User_Name")%> 
对 【 
<%#Eval("To_UserName")%>】说: 
</td> 
</tr> 
<tr> 
<td align="left" valign="top" class="font_07" style="word-break: break-all; width: 600px; 
overflow: auto;"> 
    <%#Eval("To_Context")%> 
</td> 
</tr> 
</table> 
</li> 
</ItemTemplate> 
</asp:DataList> 
</ul> 
</div> 
<div class="fy"> 
<div id="divPage"> 
</div> 
</div> 
</div> 
<div id="back_zhufu"> 
</div> 
</div> 
</div> 
<asp:Literal ID="ltScript" runat="server"></asp:Literal> 
</form> 
</body> 
</html>

C# Code:
private int _MaxPageSize = 1; 
protected void Page_Load(object sender, EventArgs e) 
{ 
int page = 1; 
if (Request.QueryString["Page"] != null && Request.QueryString["Page"].ToString() != "") 
{ 
page = Convert.ToInt32(Request.QueryString["Page"]); 
} 
int _PageSize = 5; 
BindChristData(page, _PageSize); 
ltScript.Text = "<script language=\"javascript\" type=\"text/javascript\">InitPage(\"GetCurPage\", " + page + ", " + _MaxPageSize + ", 8, true); ShowPage(\"divPage\");</script>"; 
} 
private void BindChristData(int pageIndex, int pageSize) 
{ 
int intStartIndex = (pageIndex - 1) * pageSize + 1; 
int intEndIndex = pageIndex * pageSize; 
DataSet tChrisTable = TChristmaxWishBLL.GetTChristmaxWish(intStartIndex, intEndIndex); 
if (tChrisTable != null && tChrisTable.Tables[0].Rows.Count > 0) 
{ 
ddlBlessingList.DataSource = tChrisTable; 
ddlBlessingList.DataBind(); 
_MaxPageSize = Convert.ToInt32(tChrisTable.Tables[1].Rows[0][0].ToString()) % pageSize == 0 ? Convert.ToInt32(tChrisTable.Tables[1].Rows[0][0].ToString()) / pageSize : Convert.ToInt32(tChrisTable.Tables[1].Rows[0][0].ToString()) / pageSize + 1; 
} 
} 
Sql语句: 
select row_num,User_Name,User_Email,User_Phone,To_UserName,To_Context from(SELECT ROW_NUMBER() OVER ( ORDER BY To_Date desc)as row_num,User_Name,User_Email,User_Phone,To_UserName,To_Context from TChristmaxWish where Is_Del=0 )as newTable where row_num between @intStrIndex and @intEndIndex; 
select count(id) from TChristmaxWish where Is_Del=0
Javascript 相关文章推荐
JavaScript学习笔记之Function对象
Jan 22 Javascript
jquery实现页面虚拟键盘特效
Aug 08 Javascript
浅谈angular.js中实现双向绑定的方法$watch $digest $apply
Oct 14 Javascript
非常实用的12个jquery代码片段
Nov 02 Javascript
VUEJS实战之构建基础并渲染出列表(1)
Jun 13 Javascript
js仿QQ邮箱收件人选择与搜索功能
Feb 10 Javascript
详解ionic本地相册、拍照、裁剪、上传(单图完全版)
Oct 10 Javascript
解决vue数组中对象属性变化页面不渲染问题
Aug 09 Javascript
实例详解BootStrap的动态模态框及静态模态框
Aug 13 Javascript
jQuery实现的导航条点击后高亮显示功能示例
Mar 04 jQuery
JS如何实现动态添加的元素绑定事件
Nov 12 Javascript
解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题
Sep 02 Javascript
用jquery实现的模拟QQ邮箱里的收件人选取及其他效果(一)
Jan 06 #Javascript
jQuery1.3.2 升级到jQuery1.4.4需要修改的地方
Jan 06 #Javascript
基于jQuery的试卷自动排版系统实现代码
Jan 06 #Javascript
ASP中Sub和Function的区别说明
Aug 30 #Javascript
TBCompressor js代码压缩
Jan 05 #Javascript
关于Mozilla浏览器不支持innerText的解决办法
Jan 01 #Javascript
Js event事件在IE、FF兼容性问题
Jan 01 #Javascript
You might like
jquery keypress,keyup,onpropertychange键盘事件
2010/06/25 Javascript
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
html5 canvas js(数字时钟)实例代码
2013/12/23 Javascript
类似php的js数组的in_array函数自定义方法
2013/12/27 Javascript
js取得html iframe中的元素和变量值
2014/06/30 Javascript
JavaScript 性能优化小结
2015/10/12 Javascript
jQuery AJAX timeout 超时问题详解
2016/06/21 Javascript
第一次接触神奇的Bootstrap基础排版
2016/07/26 Javascript
将json转换成struts参数的方法
2016/11/08 Javascript
AngularJS变量及过滤器Filter用法分析
2016/11/22 Javascript
web 屏蔽BackSpace键实例代码
2016/12/24 Javascript
详解jquery validate实现表单验证 (正则表达式)
2017/01/18 Javascript
原生js实现旋转木马轮播图效果
2017/02/27 Javascript
js封装成插件_Canvas统计图插件编写实例
2017/09/12 Javascript
JS中的事件委托实例浅析
2018/03/22 Javascript
详解搭建es6+devServer简单开发环境
2018/09/25 Javascript
js canvas实现画图、滤镜效果
2018/11/27 Javascript
JS前端知识点offset,scroll,client,冒泡,事件对象的应用整理总结
2019/06/27 Javascript
浅谈layui 数据表格前后台传值的问题
2019/09/12 Javascript
node.js 使用 net 模块模拟 websocket 握手进行数据传递操作示例
2020/02/11 Javascript
[01:39](回顾)各路豪强针锋相对,几经鏖战四强产生
2014/07/01 DOTA
python实现数据写入excel表格
2018/03/25 Python
Django实战之用户认证(初始配置)
2018/07/16 Python
强悍的Python读取大文件的解决方案
2019/02/16 Python
python提取照片坐标信息的实例代码
2019/08/14 Python
Java Spring项目国际化(i18n)详细方法与实例
2020/03/20 Python
在css3中background-clip属性与background-origin属性的用法介绍
2012/11/13 HTML / CSS
为数据库创建索引都需要注意些什么
2012/07/17 面试题
this关键字的含义
2015/04/08 面试题
一些Unix笔试题和面试题
2013/01/22 面试题
教育孩子心得体会
2014/01/01 职场文书
酒店总经理欢迎词
2014/01/15 职场文书
物流专员岗位职责
2014/02/17 职场文书
企业务虚会发言材料
2014/10/20 职场文书
校运会通讯稿
2015/07/18 职场文书
Redis命令处理过程源码解析
2022/02/12 Redis