bootstrap table 服务器端分页例子分享
1,前台引入所需的js 可以从官网上下载
var url = contextPath+'/fundRetreatVoucher/fundBatchRetreatVoucherQuery.htm';
$('#tab').bootstrapTable({
method: 'get', //这里要设置为get,不知道为什么 设置post获取不了
url: url,
cache: false,
height: 400,
striped: true,
pagination: true,
pageList: [10,20],
// contentType: "application/x-www-form-urlencoded",
pageSize:10,
pageNumber:1,
search: true,
sidePagination:'server',//设置为服务器端分页
queryParams: queryParams,//参数
showColumns: true,
showRefresh: true,
minimumCountColumns: 2,
clickToSelect: true,
smartDisplay:true,
columns: [
{
field: 'interfaceInfoCode',
title: '资金通道编码',
align: 'center',
width: '180',
valign: 'bottom',
sortable: true
}, {
field: 'retreatBatchCode',
title: '资金退回批次号',
align: 'center',
width: '200',
valign: 'middle',
sortable: true
}, {
field: 'total',
title: '总笔数',
align: 'center',
width: '10',
valign: 'top',
sortable: true
}, {
field: 'totalMoney',
title: '总金额',
align: 'center',
width: '100',
valign: 'middle',
clickToSelect: false
}, {
title: '操作',
field: 'state',
align: 'center',
width: '200',
valign: 'middle',
}]
});
}
//设置传入参数
function queryParams(params) {
return params
}
$(function(){
getTab();
})
2 后台
获取limit offset ,有些网站上 要格式化传入参数 获取pageSize,pageIndex 反正我是没有成功,如果知道 可以分享给我
// 每页行数
int showCount = request.getParameter("limit") == null ? 10 : Integer.parseInt(request.getParameter("limit"));/
if (currentPage != 0) {// 获取页数
currentPage = currentPage / showCount;
}
currentPage += 1;
JSONObject json = new JSONObject();
json.put("rows", bfrv); //这里的 rows 和total 的key 是固定的
json.put("total", total);
bootstrap table 服务器端分页例子分享的更多相关文章
- bootstrap table 服务器端分页例子
1,前台引入所需的js 可以从官网上下载 function getTab(){ var url = contextPath+'/fundRetreatVoucher/fundBatchRetreatV ...
- 161222、Bootstrap table 服务器端分页示例
bootstrap版本 为 3.X bootstrap-table.min.css bootstrap-table-zh-CN.min.js bootstrap-table.min.js 前端boot ...
- bootstrap table 服务器端分页--ashx+ajax
1.准备静态页面 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-T ...
- [前端插件]Bootstrap Table服务器分页与在线编辑应用总结
先看Bootstrap Table应用效果: 表格用来显示数据库中的数据,数据通过AJAX从服务器加载,同时分页功能有服务器实现,避免客户端分页,在加载大量数据时造成的用户体验不好.还可以设置查询数据 ...
- C# Bootstrap table之 分页
效果如图: 一.声明talbe <div class="container"> <table id="table" class="t ...
- [转]C# Bootstrap table之 分页
本文转自:https://www.cnblogs.com/zhangjd/p/7895453.html 效果如图: 一.声明talbe <div class="container&qu ...
- [转]Bootstrap table后端分页(ssm版)
原文地址:https://www.cnblogs.com/flyins/p/6752285.html 说明bootstrap table可以前端分页,也可以后端sql用limit分页.这里讲的是后端分 ...
- Bootstrap table后端分页(ssm版)
说明bootstrap table可以前端分页,也可以后端sql用limit分页.这里讲的是后端分页,即实用limit.性能较好,一般均用这种源码下载地址:https://git.oschina.ne ...
- Bootstrap table前端分页(ssm版)
说明bootstrap table可以前端分页,也可以后端sql用limit分页.前端分页下性能和意义都不大,故一般情况下不用这种,请看我的另一篇后端分页的博客源码下载地址:https://git.o ...
随机推荐
- List IEnumerable
//按部门汇总 IEnumerable<WeekReportWithDepartmentInfo> report = summary .Grou ...
- SpringMVC——项目启动时从数据库查询数据
SpringMVC项目中遇到这样的问题: 1.很多数据字典需要从数据库中查询: 2.懒得修改SQL语句: 3.想在项目中声明静态变量存储数据字典,但是希望这个字典可以在项目启动时进行加载. 当遇到这样 ...
- Android开发——避免内存泄露
本文翻译自Avoiding memory leak——Post by Romain Guy 著作权归原作者所有.转载请注明出处,由JohnTsai翻译 Android应用被分配的堆的大小限制为16MB ...
- C++学习(二)
九.3.内联1)编译器用函数的二进制代码替换函数调用语句,减少函数调用的时间开销.这种优化策略成为内联.2)频繁调用的简单函数适合内联,而稀少调用的复杂函数不适合内联.3)递归函数无法内联.4)通过i ...
- Asp.net 上传文件小叙(修改FileUpload显示文字等)
想要在asp.net网站上上传文件就得用到FileUpload,可是这个控件中“浏览”没法修改,可以使用html中<input type="file" 来解决该问题. 首先页 ...
- C#微信公众号开发 -- (三)用户关注之后自动回复
通过了上一篇文章之后的微信开发者验证之后,我们就可以做微信公众号的代码开发了. 当我们点击关注某个公众号的时候,有时候会发现他会自动给我们回复一条消息,比如欢迎关注XXX公众号.这个功能其实是在点击关 ...
- ArcGis for WPF(1)
这篇文章主要是讲窗体中怎么加载一张在线地图. 第一步:首先引用ESRI.ArcGIS.Client.dll类库. 第二步:在XAML中添加如下代码: <Window x:Class=" ...
- ReactNative-----环境搭建二(android)
一.初始化一个ReactNative项目 在指定目录运行命令:react-native init Vince(项目名称) //其过程就是在使用CLI工具构建项目, 命令行代码 F:\React> ...
- UVA 11991 Easy Problem from Rujia Liu?(vector map)
Easy Problem from Rujia Liu? Though Rujia Liu usually sets hard problems for contests (for example, ...
- Codevs 1427 特种部队(双路DP)
1427 特种部队 时间限制: 1 s 空间限制: 64000 KB 题目等级 : 黄金 Gold 题目描述 Description 某特种部队接到一个任务,需要潜入一个仓库.该部队士兵分为两路,第一 ...