bootstrap table queryParams 与 queryParamsType “limit”使用

$table.bootstrapTable({
    url: ,
   queryParams:queryParams,
    queryParamsType : "limit",
    height:'getHeight' ,
    striped: true,
    showRefresh: true,
    showColumns: false,
    order: "asc",                    //  需要配置 否则 是undefined
    minimumCountColumns: 2,
    clickToSelect: true,
    detailView: true,               //看过一篇关于父子表重新构造table的例子、
    detailFormatter: detailFormatter,  //我重写了这个 看下面
    pagination: true,
    paginationLoop: false,
    sidePagination: 'server',
    silentSort: false,
    silent:true,
    sortable: true,                 //列排序
    sortName:'',                    // 需要配置 否则 是undefined
    smartDisplay: false,
    escape: true,
    searchOnEnterKey: true,
    idField: '',
    uniqueId:'',
    limit:1,                       // 需要配置 否则 是undefined
    offset: 10                     // 需要配置 否则 是undefined

上面所有加了注释的  // 需要配置  必须项 否则 自写的查询 中对应的 limit, offset, search, sort, order 参数取不到,

queryParams 参考:

function queryParams(params){    
    var param = {
        offset: params.offset,
        limit: params.limit,
        sort: params.sort,
        order: params.order,
       // search:params.search,
       //可以是添加自己要帅选的列与pojo 属性对应
    };

    return param;
}

/**
*  2019-02-20  更新
*此方法你可以在第一次加载必要参数查询后的具体筛选参数
*此方法可绑定到bootstrapTable  toolbar中DOM元素中
*/
function queryBtn(){

  //此方法 可传递相关参数 一般传递            query:{接收参数名:'value值',接收参数名:'value值'}
  $('#table的ID名').bootstrapTable('refresh',{query:{ /*注释说明*/}})
    
    
}

 

查询按钮事件:


$(document).on('click', "#与上面buttonID对应",function(){ $('#table').bootstrapTable('refresh' ); });

detailFormatter:

function detailFormatter(index, row){
    var html = [];
    html.push('自写html');
    $.each(row, function (key, value) {
        if(key!='id'||key!='ck') {      //key 列  value  列对应值  此处没有向用户展示ID列信息以及过滤了checkbox 列
            switch (key) {
                /**/

                     }

               }

     })
     html.push('自写html');
    return html.join('');

}

               

2019-4-8 更新 实际使用中发现: 

table 的   clickToSelect(点击选中行)  属性 和属性 同时设置时候如何 点击表格空白处 js会抛出错误! 但是不配置 table属性 
clickToSelect时候 点击选中不起作用! 
更新 于 2019-5-17 
   对table  设定 clickToSelect=true 之后,列属性设定clickToSelect:false (该属性点击选中行)可能引起报错原因解释!
table columns片段示例:
  {field: 'ck', checkbox: true},  {field: 'ck',formatter:'自定义函数',title:'序号',clickToSelect: false } 
造成js报错的原因是 field  绑定了同一个 实体属性 如上  同为ck 如 操作列 其他实现 用 formatter(value,row,index) row 取对应 属性值 。

完结!

你可能感兴趣的:(bootstrap,bootstrap,table)