Bootstrap Table 后端分页详解防坑

教程分享 > WEB技术 (10021) 2024-03-05 14:03:17

Bootstrap Table 后端分页详解防坑

$('#tableId').bootstrapTable({
 method:'post',//请求方法
 url:'',//后台地址
 pagination: true,//是否分页,默认false,必须配置
 sidePagination: "server",//必须 否则返回得数据可能不会显示到表里面(坑了我很久)
 pageSize: 10,//分页大小设置
 dataType:"json",//请求数据类型
 contentType:"application/json;charset=UTF-8",//POST JSON数据必须指定
 clickToSelect: true,//点击选中复选框
 responseHandler: function (res) {  
  //最终格式为 return {"rows":[],"total":0}
 },//返回数据自定义处理
 queryParams : function(params) {
            var pageNum=0;
            console.log(params.offset);
            console.log(params.limit);
            if(params.offset>0)
            {
                pageNum=params.offset/params.limit;
                if(pageNum==0) pageNum=1;
            }
            return JSON.stringify({
                "pageNum": pageNum+1,
                "pageSize": params.limit,
                //其他参数
            });
 },
 columns:[
               {
                    field: 'id',
                    title: 'ID',
                    checkbox:true,
                },{
                    field: 'opField',
                    title: '客户名称',
                    formatter:function (value,row,index) {
                        let clients=row.orderBodies;
                        let names=new Array();
                        $.each(clients,function (index,item) {
                            names.push(item.enterpriseName);
                        });
                        return names.join("、");
                    }
                },
],
});
https://www.leftso.com/article/656.html

相关文章
​Bootstrap TableBootstrap Table 多选以及获取多选值实现本文主要讲解在bootstrap table组建使用过程中,配置多选和获取多选选中的值
在Bootstrap Table 使用过程中,从表格的columns里面的value取一些特殊字符的值会被转义,比如 &符号会被转义城&
问题描述最近一个项目遇到Bootstrap Table pageList 配置不生效,配置多个选项后无法还是无法弹出选择
在使用bootstrap-table过程中,我们可能会遇到列属性events事件不能生效的问题,并会发现这个问题有时存在有时却又不存在,这是什么原因呢?其实造成events事件失效的原因非常简单...
Bootstrap Table 后端分页详解防坑$('#tableId').bootstrapTable({ method:'post',//请求方法 url:'',//后台地址 p...
Bootstrap-tab 组件增强插件效果图​​bootstrap-tab组件是对原生的bootstrap-tab组件的封装,方便开发者更方便地使用,主要包含以下功能:tab页初始化关闭tab...
Bootstrap Tab基础使用,首先是引入必要的css和js,这里暂时忽略核心代码:<ul class="nav nav-tabs"&gtl; ...
Bootstrap Tab 示例代码<div class="tabs-container"&gtl; <ul class="nav nav-tabs"&gtl; <l...
最终效果图  实现逻辑和代码 html代码   <el-table       :data="renderDynamic"       ref="produc...
方案一$("#dialog-modal").modal({backdrop:"static",//点击空白处不关闭对话框show:false,//按esc键盘不关闭.})方案二在弹框元素(下面以...
Angular HttpClient使用RxJS Observable例子,习使用Angular2  HttpClient服务从在线REST API获取数据并将其作为Observable对象/数...
一、项目环境Spring Boot 2.1.2.RELEASEshiro-spring 1.4二、去掉URL jsessionid在shiro配置中,配置关闭url中显示sessionId ...
依赖说明tabler icons 3.11.0 (基于webfont模式实现)fontIconPicker 3.1.1jquery 3.6.0 实现效果打开选择
 bootstrapValidator 创建/重置/手动验证使用详解  bootstrapValidator 初始化  function initValidator() { $("#d...
MySQL,从大概5.7版本开始支持json数据类型,但是5.7的json查询不支持创建索引,在MySQL 8.0.17 后支持了索引,但是创建和查询使用索引与常规索引不同