jQuery Pagination分页插件使用方法详解


Posted in Javascript onFebruary 28, 2017

本文实例为大家分享了jQuery Pagination分页插件的具体代码,供大家参考,具体内容如下

一、引用CSS和JS:

<link href="/Content/Plugins/jQuery.Pagination_v2.2/pagination.css" rel="external nofollow" rel="stylesheet"
 type="text/css" />
<script src="/Content/Plugins/jQuery.Pagination_v2.2/jquery.pagination.js" type="text/javascript"></script>

二、HTML:

<div id="Pagination" class="flickr" style="margin-top: 10px; margin-left: 10px;">
</div>

三、JS:

$(function () {
 var total = parseInt("@(ViewBag.total)");
 var page = parseInt("@(ViewBag.page)") - 1;
 var pageSize = parseInt("@(ViewBag.pageSize)");

 $("#Pagination").pagination(total, {
 callback: function (page_id) {
  window.location = "BoardList?page=" + page_id + "&pageSize=" + this.items_per_page;
 }, //PageCallback() 为翻页调用次函数。
 prev_text: " 上一页",
 next_text: "下一页 ",
 items_per_page: 10, //每页的数据个数
 num_display_entries: 1, //两侧首尾分页条目数
 current_page: page, //当前页码
 num_edge_entries: 11 //连续分页主体部分分页条目数
 });
});

四、后台代码:

public ActionResult BoardList()
{
 PagerModel pager = new PagerModel();
 if (Request["page"] == null)
 {
 pager.page = 1;
 pager.rows = 10;
 pager.sort = "Id";
 pager.order = "desc";
 }
 else
 {
 pager.page = int.Parse(Request["page"]) + 1;
 pager.rows = int.Parse(Request["pageSize"]);
 pager.sort = "Id";
 pager.order = "desc";
 }

 boardManageService.GetList(ref pager);
 List<BoardModel> boardList = pager.result as List<BoardModel>;
 ViewData["BoardModelList"] = boardList;
 ViewBag.page = pager.page;
 ViewBag.total = pager.totalRows;
 ViewBag.pageSize = pager.rows;

 return View();
}
#endregion

更多精彩内容请点击:jquery分页功能汇总进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery获取iframe的document对象的方法
Oct 10 Javascript
让html页面不缓存js的实现方法
Oct 31 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
逻辑表达式中与或非的用法详解
Jun 06 Javascript
Web打印解决方案之普通报表打印功能
Aug 29 Javascript
AngularJS通过$http和服务器通信详解
Sep 21 Javascript
JS产生随机数的用法小结
Dec 10 Javascript
javascript数组去重常用方法实例分析
Apr 11 Javascript
移动端使用localResizeIMG4压缩图片
Apr 22 Javascript
详解Node全局变量global模块
Sep 28 Javascript
浅谈Vue数据响应
Nov 05 Javascript
javascript实现点击产生随机图形
Jan 25 Javascript
完美解决input[type=number]无法显示非数字字符的问题
Feb 28 #Javascript
canvas红包照片实例分享
Feb 28 #Javascript
详解本地Node.js服务器作为api服务器的解决办法
Feb 28 #Javascript
jquery操作select取值赋值与设置选中实例
Feb 28 #Javascript
JS使用面向对象技术实现的tab选项卡效果示例
Feb 28 #Javascript
基于cookie实现zTree树刷新后展开状态不变
Feb 28 #Javascript
js中Number数字数值运算后值不对的解决方法
Feb 28 #Javascript
You might like
PHP生成二维码的两个方法和实例
2014/07/01 PHP
laravel 解决paginate查询多个字段报错的问题
2019/10/22 PHP
如何实现iframe(嵌入式帧)的自适应高度
2006/07/26 Javascript
jquery select多选框的左右移动 具体实现代码
2013/07/03 Javascript
JS获取键盘上任意按键的值(实例代码)
2013/11/12 Javascript
js数组去重的5种算法实现
2015/11/04 Javascript
学习Javascript面向对象编程之封装
2016/02/23 Javascript
location.hash保存页面状态的技巧
2016/04/28 Javascript
JS实现的自定义水平滚动字体插件完整实例
2016/06/17 Javascript
详解AngularJS中的表单验证(推荐)
2016/11/17 Javascript
div实现自适应高度的textarea实现angular双向绑定
2017/01/08 Javascript
AngularJS的$location使用方法详解
2017/10/19 Javascript
JS实现中英文混合文字溢出友好截取功能
2018/08/06 Javascript
vue中Element-ui 输入银行账号每四位加一个空格的实现代码
2018/09/14 Javascript
angular组件间传值测试的方法详解
2020/05/07 Javascript
[02:43]DOTA2英雄基础教程 半人马战行者
2014/01/13 DOTA
[55:04]海涛DOTA2死魂复燃6.82版本介绍
2014/09/28 DOTA
TensorFlow神经网络优化策略学习
2018/03/09 Python
在python中将字符串转为json对象并取值的方法
2018/12/31 Python
python启动应用程序和终止应用程序的方法
2019/06/28 Python
python集合删除多种方法详解
2020/02/10 Python
Python连接Mysql进行增删改查的示例代码
2020/08/03 Python
利用CSS3实现进度条的两种姿势详解
2017/03/21 HTML / CSS
美国隐形眼镜销售网站:ContactsDirect
2017/10/28 全球购物
Peter Millar官网:美国高档生活服饰品牌
2018/07/02 全球购物
Ryderwear澳洲官网:澳大利亚高端健身训练装备品牌
2018/09/18 全球购物
捷克玩具商店:Bambule
2019/02/23 全球购物
酒店副总经理岗位职责范本
2014/02/04 职场文书
万年牢教学反思
2014/02/15 职场文书
幼儿园父亲节活动方案
2014/03/11 职场文书
教育系统干部作风整顿心得体会
2014/09/09 职场文书
住房抵押登记委托书
2014/09/27 职场文书
群众路线教育实践活动剖析材料
2014/09/30 职场文书
考试没考好检讨书(精选篇)
2014/11/16 职场文书
2015年学生会个人工作总结
2015/04/09 职场文书
班级班风口号大全
2015/12/25 职场文书