bootstrap table加载:无论是服务器分页还是客户端分页,重新加载表格前请一定先销毁!销毁!销毁!  !!销毁表格::

客户端分页:

1. 表格销毁

$('#tableID').bootstrapTable('destroy');
2. 制表
function addTable();
3. 加载表格数据
$('#tableID').bootstrapTable('load', data);
 
服务器端分页:
function tableInit (fdp) {
// 表格销毁
$('#tableID').bootstrapTable('destroy');
// 重新制表
$('#tableID').bootstrapTable({
method: 'POST',
url: url, // 后端接口地址
//POST请求 必须包含contentType
contentType: 'application/x-www-form-urlencoded',
// 服务器分页
sidePagination: 'server',
queryParams: function (params) {
// fdp可以是传入的参数,params为内置参数,包含页码等
fdp.pageSize = params.pageSize;
fdp.pageNumber = params.pageNumber;
// !!!!!
// 非常重要!!!当传入的参数(对象)无法封装成对象时,使用下面方法!! return { strParams: JSON.stringify(fdparam) }
return { strParams: JSON.stringify(fdparam) };
},
pagination: true,
pageTo: true,
pageSize: 9,
pageNumber: 1,
// striped: true,
// clickToSelect: true,
detailFormatter: true,
detailView: true,
// search
// search: true,
searchAlign: 'right',
// searchOnEnterKey:true,
trimOnSearch: true,
undefinedText: '-',
pageList: [],
queryParamsType: '',
paginationLoop: true,
strictSearch: false,
responseHandler: function (res) {
var data = res.result.result;
return {
'total': rowlength, //总的数据长度
'rows': row //单页查询返回的数据
}
},
// showPaginationSwitch: true,
columns: []
}

ps:::服务器端分页的请求参数(queryParams)一定是一个封装的json对象,传入不成功,需要进行转换!

bootstrapTable服务器端分页的更多相关文章

  1. bootstrap table 服务器端分页例子

    1,前台引入所需的js 可以从官网上下载 function getTab(){ var url = contextPath+'/fundRetreatVoucher/fundBatchRetreatV ...

  2. bootstrap table 服务器端分页例子分享

    这篇文章主要介绍了bootstrap table 服务器端分页例子分享,需要的朋友可以参考下 1,前台引入所需的js 可以从官网上下载 复制代码代码如下: function getTab(){var ...

  3. bootstrap table 服务器端分页--ashx+ajax

    1.准备静态页面 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-T ...

  4. datatables服务器端分页要点

    背景:当要查询大量数据的时候,有datatables自身的分页,明显查询比较慢,这是要使用服务器端分页 参数:"bServerSide": true, "fnServer ...

  5. datatables.js 简单使用--多选框和服务器端分页

    说明:datatables是一款jQuery表格插件.感觉EasyUI的datagrid更易用 内容:多选框和服务器端分页 缘由:写这篇博客的原因是datatables的文档写的不怎么样,找东西很麻烦 ...

  6. bootStrap-table服务器端后台分页的使用,以及自定义搜索框的实现,前端代码到数据查询超详细讲解

    关于分页,之前一直纯手写js代码来实现,最近又需要用到分页,找了好多最终确定bootstrap-table,正好前端页面用的是bootstrap. 首先下载BootStrap-table的js和CSS ...

  7. 161222、Bootstrap table 服务器端分页示例

    bootstrap版本 为 3.X bootstrap-table.min.css bootstrap-table-zh-CN.min.js bootstrap-table.min.js 前端boot ...

  8. 关于Jquery EasyUI中的DataGrid服务器端分页随记

    一.关于DataGrid的分页和排序参数 对于分页参数不需要用户指定,程序在AJAX请求的时候会带上分页和排序需要的参数 每页显示条数:rows 当前页:page 排序字段:sort  [multiS ...

  9. Spring + Struts + Hibernate + Bootstrap-table 实现分页和增删改查

    1.bootstrap界面效果图: 2.Teacher实体类 public class Teacher { private int id; private String name; private S ...

随机推荐

  1. WPF之设计UI界面

    一些后面再细看的内容: Document Outline窗口有什么帮助? 1.Panel控件 为了便于组织窗口内很多的UI元素,要使用Panel控件(也称为布局管理器).Panel容纳所有的窗口UI元 ...

  2. cesium3dtiles位置改变

    cesium偏移3dtiles高度var heightOffset = 20.0; var boundingSphere = tileset.boundingSphere; var cartograp ...

  3. NoSuchMethodError解决方法

    下面演示下如何在啥都不知道的情况下遇到该错误的解决思路: 随便找一个错误示例: Caused by: java.lang.NoSuchMethodError: org.eclipse.jdt.inte ...

  4. 数据传输流程和socket简单操作

    一.***C/S架构:客户端(client)/服务端(server)架构, B/S架构:浏览器(browser) / 服务端(server)架构 软件cs架构:浏览器,qq,微信,陌陌等等硬件cs架构 ...

  5. [java,2018-06-26] 扑克牌抽牌求和问题

    问题: 一副扑克牌,除去大小王后共52张牌,随机从中抽八张牌,问八张牌的和最有可能是多少? 分析: 这52张牌,其实就是数字 1 2 3 ...13, 每个数字出现4次.随机抽出8个数,问组成的和最有 ...

  6. C++_数字时钟软件实现设计

    利用C++学习内容,通过windows自带函数实现一个简易的时钟 #include<iostream> #include<windows.h> //延时与清屏头文件 using ...

  7. MVC 执行顺序

    MVC在底层和传统的asp.net是一致的,在底层之上,相关流程如下: 1)Global.asax里,MvcApplication对象的Application_Start()事件中,调用 RouteC ...

  8. mycat数据中间件、nginx

      MyCat & Nginx  课程目标 目标1:理解MyCat分片,能够配置MyCat分片 目标2:掌握Nginx的安装与静态网站部署 目标3:掌握Nginx的静态网站部署 目标4:理解N ...

  9. 运行UMAT:+ABQ和VS、IVF绑定

    运行UMAT: 1.run-script----xxxx.py2.属性---编辑材料---通用---非独立变量---用户材料3.job---编辑作业---通用----用户子程序.for4.parall ...

  10. 爬虫之Selenium 动态渲染页面爬取

    Selenim 是一个自动化测试工具,可以利用它驱动浏览器执行特定的动作,如点击.下拉等操作,同时可以获取浏览器当前呈现的页面的源代码,做到可见及可爬 1.使用流程 1)声明浏览器对象 Seleniu ...