bootstrap table简介02

来源:互联网 发布:linux换成windows系统 编辑:程序博客网 时间:2024/06/06 03:12

一、根据id的值选中指定行数据
var data = [];
data=[1,2,3,4,5];
选中$(“#”+tableId).bootstrapTable(‘checkBy’, {field:’id’, values:data});
取消选中$(“#”+tableId).bootstrapTable(‘uncheckBy’, {field:’id’, values:data});
选中全部 $(‘#’+tableId).bootstrapTable(‘checkAll’);
取消选中全部 $(‘#’+tableId).bootstrapTable(‘uncheckAll’);

二、根据行下标 改变某一行数据
$(“#TableList”).bootstrapTable(‘updateRow’, {
index: 0, //行下标
row: {
result:’未返回‘,
httpType:’异常‘,
httphend:”,
isEnd:’3’,
}
});
三、 翻页全选功能

var IsCheckAll = false;//是否去全选var tableNoCheck =[]; //反选的idvar tableTotal = 0;  // 表格总条数//点击全选按钮触发方法 将“全选”改为“取消全选” 将数据全部选中并将反选的数组置空function isCheckAll(){    if($("#taskIsCheck").text()=='全选'){        $("#taskIsCheck").html("取消全选");        onCheckAllTable('weeklyContentTable',true);        IsCheckAll = true;    }else{        $("#taskIsCheck").html("全选");        onCheckAllTable('weeklyContentTable',false);        IsCheckAll = false;    }    tableNoCheck =[];}function onTaskCheckAllTable(tableId,flag,rows,NoCheck){    if(rows!=undefined){        var data=[];        for(var i=0;i<rows.length;i++){            var row=rows[i];            if(NoCheck.length>0 && $.inArray(row.id, NoCheck)>=0){            }else{                data.push(row.id);            }        }        $("#"+tableId).bootstrapTable('checkBy', {field:'id', values:data});    }else{        if(flag){            $('#'+tableId).bootstrapTable('checkAll');        }else{            $('#'+tableId).bootstrapTable('uncheckAll');        }    }}//选中触发方法function onCheckAllTable(tableId,flag,rows,NoCheck){if(rows!=undefined){    var data=[];    for(var i=0;i<rows.length;i++){        var row=rows[i];        if(NoCheck.length>0 && $.inArray(row.id, NoCheck)>=0){        }else{            data.push(row.id);        }    }    $("#"+tableId).bootstrapTable('checkBy', {field:'id', values:data});}else{    if(flag){        $('#'+tableId).bootstrapTable('checkAll');    }else{        $('#'+tableId).bootstrapTable('uncheckAll');    }//取消选中数据调用方法function addNoCheck(NoCheck,id,total,IsCheckAllId,flag){    NoCheck.push(id);    if(NoCheck.length>=total){        IsCheckAll = false;        tableNoCheck =[];        $("#"+IsCheckAllId).attr("checked",false);    }}//选中数据条用方法function delNoCheck(NoCheckData,id){    if(NoCheckData.length>0 && $.inArray(id, NoCheckData)>=0){        NoCheckData.splice($.inArray(id, NoCheckData),1);    }}//数据查询function queryWeeklyContentTable(){//销毁表格  $('#weeklyContentTable').bootstrapTable('destroy');//初始化表格,动态从服务器加载数据$('#weeklyContentTable').bootstrapTable({            method: 'post',            url : '',            cache: false,            pagination: true,            height:444,            pageSize: 15,  //每页显示的记录数              pageNumber:1,             pageList: [10, 15, 20, 25],   //记录数可选列表            clickToSelect: true,             sidePagination:'server', //表示服务端请求            responseHandler: responseHandler, //设置返回数据的接收            queryParams:testWeeklyContentParams, //设置传参            queryParamsType : "undefined",            contentType: "application/x-www-form-urlencoded", //这个必须有 要不然后台接收不到分页参数    妈蛋            onLoadSuccess:function testWeeklyContentParams(data) {   //设置查询参数                  // 全选调用                tableTotal = data.total;                if(IsCheckAll){                    onTaskCheckAllTable('weeklyContentTable',true,data.rows,tableNoCheck);                  }            },            onCheck:function (row) {//选中触发事件                if(IsCheckAll){                   delNoCheck(tableNoCheck,row.id);                }            },            onUncheck:function (row) {//选中触发事件                if(IsCheckAll){                   addNoCheck(tableNoCheck,row.id,tableTotal,'taskCheckAll','task');                }            },            onCheckAll:function (rows) {//选中触发事件                if(IsCheckAll){                    for(var i=0;i<rows.length;i++){                        var row = rows[i];                        delNoCheck(tableNoCheck,row.id);                    }                }            },            onUncheckAll:function (rows) {//取消选中触发事件                if(IsCheckAll){                    for(var i=0;i<rows.length;i++){                        var row = rows[i];                        addNoCheck(tableNoCheck,row.id,tableTotal,'taskCheckAll','task');                    }                }            },            columns: [                 { field: 'state',  checkbox: true},                {  field: 'id',  title: 'id',valign: 'middle' },                 {  field: 'Name',  title: '名称',valign: 'middle'}            ]      });  }

四、隐藏列
$(‘#tableid’).bootstrapTable(‘hideColumn’, ‘id’);