Bootstrap 分页功能
function bootstrappage() {
var options = {
currentPage: currentPage,
totalPages: totalPages,
size: 'normal',
itemContainerClass: function (type, page, current) {
return (page === current) ? "active" : "pointer-cursor";
},
itemTexts: function (type, page, current) {
switch (type) {
case "first":
return "First";
case "prev":
return "上一页";
case "next":
return "下一页";
case "last":
return "Last";
case "page":
return page;
}
},
shouldShowPage: function (type, page, current) {
switch (type) {
case "first":
case "last":
return false;
default:
return true;
}
},
onPageClicked: function (e, originalEvent, type, page) {
currentPage = page;
zwobj.url = "../../Handler/PostsHandler.ashx?action=GetPosts";
zwobj.data = { current: currentPage, total: 10 };
ajaxData();
}
};
$('#example').bootstrapPaginator(options);
}
//---------------------------- 后台返回方法 ---------------------------------
function ajax_GetPosts(data) {
$(".table tbody").html("");
var html = "";
var len = data.Data.length;
for (var i = 0; i < len; i++) {
html += "<tr>" +
"<td><a href='#'>" + data.Data[i].Title + "</a></td>" +
"<td>" + eval("new " + data.Data[i].CreateDt.split('/')[1]).Format("yyyy-MM-dd") + "</td>" +
"<td>" + data.Data[i].ReplyCount + "/" + data.Data[i].ViewCount + "</td>" +
"<td>" + data.Data[i].UserName + "</td></tr>";
}
$(".table tbody").html(html);
var total = parseInt(data.Other);
totalPages = (total / 10) + 1;
bootstrappage();
}
Bootstrap 分页功能的更多相关文章
- 利用Bootstrap Paginator插件和KnockoutJS完成分页功能
在最近一个项目中,需要结合一堆条件查询并对查询的结果数据完成一个简单分页功能,可是做着做着,自己的思路越来越模糊,做到心态崩溃!!! 哈哈,特此花点时间重新总结,并从最简单的分页,然后向多条件查询分页 ...
- C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi
C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...
- 【jQuery 分页】jQuery分页功能的实现
自写的jQuery实现分页功能的分页组件: 功能效果如下: 分页组件就是上图中的三部分, 分别放在表格上部 和下部 . 其中, 1>>>页面的代码如下: product.jsp 其 ...
- python_way day18 html-day4, Django路由,(正则匹配页码,包含自开发分页功能), 模板, Model(jDango-ORM) : SQLite,数据库时间字段插入的方法
python_way day18 html-day4 1.Django-路由系统 - 自开发分页功能 2.模板语言:之母板的使用 3.SQLite:model(jDango-ORM) 数据库时间字 ...
- Java Web -【分页功能】详解
分页简介 分页功能在网页中是非常常见的一个功能,其作用也就是将数据分割成多个页面来进行显示. 使用场景: 当取到的数据量达到一定的时候,就需要使用分页来进行数据分割. 当我们不使用分页功能的时候,会面 ...
- bootstrap分页插件的使用
项目中需要实现文章列表的分页显示,由于使用了bootstrap框架,所以我们选择bootstrap的分页实现方法.网上有一些这方面的介绍文章,并且也有相关的示例程序.这里结合我们的项目,介绍一下使用b ...
- python2.0_day19_前端分页功能的实现
我们前面完成的客户纪录展示,只有4条,如果有上百条就不能在1页中全部展示了,那样是不人性化的.另外一次性取出来,数据量也比较大.假如现在有95条数据,我们想实现一个每页展示20条,那就分为5页.假如我 ...
- django高级应用(分页功能)
django高级应用(分页功能) 1.原生分页应用 前端html代码 <!DOCTYPE html> <html lang="en"> <head&g ...
- [ Laravel 5.5 文档 ] 数据库操作 —— 在 Laravel 中轻松实现分页功能
 简介 在其他框架中,分页是件非常痛苦的事,Laravel 让这件事变得简单易于上手.Laravel 的分页器与查询构建器和 Eloquent ORM 集成在一起,并开箱提供方便的.易于使用的.基于 ...
随机推荐
- Android开发环境搭建完全图解(转)
本文介绍从0开始,在Linux系统下,搭建一个Android开发环境的方法. 如果你是<Learning Android>这本书的读者,你也可以参考这篇文章,因为这篇文章是以书中的安装方法 ...
- CentOS 6 下安装Python 3
可以下载各个版本的python:https://www.python.org/ftp/python/ 配置安装 下载最新的安装包(截止2013/11/05),还是3.3.2版本. #wget http ...
- HTTP层 —— 响应
1.创建响应 字符串&数组 所有路由和控制器都会返回一个被发送到用户浏览器的响应,Laravel 提供了多种不同的方式来返回响应,最基本的响应就是从路由或控制器返回一个简单的字符串,框架会将这 ...
- FileReader 的了解
FileReader的解释 异步的读取存储在用户计算机上的文件 创建一个FileReader 对象 var reader = new FileReader(); FileReader的方法和事件 参数 ...
- Spring 3.x 实践 第一个例子(Spring 3.x 企业应用开发实战读书笔记第二章)
前言:工作之后一直在搞android,现在需要更多和后台的人员交涉,技术栈不一样,难免鸡同鸭讲,所以稍稍学习下. 这个例子取自于<Spring 3.x 企业应用开发实战>一书中的第二章,I ...
- python备份脚本
备份制定文件到指定目录下,文件名以当前时间 思路: 1.指定备份的文件或目录 2.指定备份的目标路径 3.压缩备份名是当前日期和时间 4.使用标准的压缩命令 1.最简单的以日期时间为文件名 2.以日期 ...
- 第十一篇、HTML5隐藏播放器播放背景音乐
html5添加网页背景音乐 一个客户要求给网站添加一个背景音乐,我用的是html5添加网页背景音乐的代码,在此记录一下以后有用. html5方法一:<audio autoplay=" ...
- 04_HttpClient发送Https请求
[实例 带Cookie访问HTTPS类型的 建信基金 的某一页面)] /** * 创建一个可以访问Https类型URL的工具类,返回一个CloseableHttpClient实例 */ public ...
- Oracle PL/SQL 异常处理
Oracle数据库中的异常:没有异常的转移,因为没有受检异常和非受检异常得区分. 1.异常的产生: 2.异常的处理: declare --变量定义,初始化赋值. begin --变量的赋值,函数调用, ...
- 【制作镜像Win*】系统安装
图形化安装系统,在询问“进行何种类型的安装?”时,选择“自定义(高级)” 下一步看不到硬盘,如图: 选择“加载驱动程序”,安装驱动. 将相应版本的netkvm.inf和viostor.inf装上. 继 ...