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’);
阅读全文
0 0
- bootstrap table简介02
- bootstrap table 简介01
- BootStrap -- Table
- Bootstrap Table
- bootstrap--table
- Bootstrap table
- bootstrap-table
- bootstrap table
- Bootstrap Table
- bootstrap table
- bootstrap table
- bootstrap table
- bootstrap table
- **BOOTSTRAP** Bootstrap简介
- Bootstrap简介
- Bootstrap简介
- bootstrap简介
- Bootstrap简介
- Matlab中对画出来的图片(plot)进行坐标轴的编辑
- 建立 mysql.sock 连接
- oracle常用函数
- passport 实现
- android studio使用gradle与gradlew打包的区别
- bootstrap table简介02
- 不想34被裁退_好好学学大数据吧!
- BZOJ1624: [Usaco2008 Open] Clear And Present Danger 寻宝之路
- Hive: SemanticException Error in parsing
- Mapnik使用postgres中的栅格数据
- 高级加密标准AES的工作模式(ECB、CBC、CFB、OFB)
- phpcmsv9 从第2或n条调用方法
- Vue.js 学习(4) -- 计算属性和Watchers
- Python strip() 和split() 函数