Bootstrap table 点击行改变背景色,点击列选中或者取消选中checkbox,根据某个属性隐藏显示某个字段

//点击选中行,改变选中行的背景颜色
(table).on(‘click-row.bs.table’, function (e, row, element){  
$(‘.success’).removeClass(‘success’);//去除之前选中的行的,选中样式  
$(element).addClass(‘success’);//添加当前选中的 success样式用于区别  
var index = $(‘#formTempDetailTable_new’).find(‘tr.success’).data(‘index’);//获得选中的行的id  
});   
//点击选中列,判断checkbox选中与取消选中
(table).on(‘click-row.bs.table’, function (e, row, element){  $(‘.success’).removeClass(‘success’);//去除之前选中的行的,选中样式  $(element).addClass(‘success’);//添加当前选中的 success样式用于区别  var index = $(‘#formTempDetailTable_new’).find(‘tr.success’).data(‘index’);//获得选中的行的id  });   //点击选中列,判断checkbox选中与取消选中
( (table).on).on(clickcell.bs.table,function(e,field,value,row, ( t a b l e ) . o n ) . o n ( ‘ c l i c k − c e l l . b s . t a b l e ′ , f u n c t i o n ( e , f i e l d , v a l u e , r o w , element){
if(field==”字段名”||field==”字段名”){//根据某个字段名判断
if((checkbox字段ID).is(‘:checked’)) {  
$(checkbox字段ID).prop(“checked”,false);  
}else{  
$(checkbox字段ID).prop(“checked”,true);  
}  
}  
});  
//根据某个属性隐藏显示某个字段  
if(
(checkbox字段ID).is(‘:checked’)) {  $(checkbox字段ID).prop(“checked”,false);  }else{  $(checkbox字段ID).prop(“checked”,true);  }  }  });  //根据某个属性隐藏显示某个字段  if(
(‘#属性值’).val()==”7”){
(table).bootstrapTable(‘showColumn’, ‘要隐藏的字段’);  
}else{
(table).bootstrapTable(‘showColumn’, ‘要隐藏的字段’);  }else{
(table).bootstrapTable(‘hideColumn’, ‘要隐藏的字段’);
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当你在 Bootstrap Table 中添加复选框时,可以使用 `getSelections` 方法获取所有选中数据,包括复选框。以下是一个示例: ```html <table id="table" data-toggle="table" data-url="data.json" data-checkbox="true"> <thead> <tr> <th data-field="state" data-checkbox="true"></th> <th data-field="id">ID</th> <th data-field="name">Name</th> <th data-field="price">Price</th> </tr> </thead> </table> <button id="btn">Get selected row</button> ``` 这个示例中,我们在表格中添加了一个复选框,并在页面中添加了一个按钮。当用户点击按钮时,我们将获取选中数据并输出到控制台。 ```javascript $('#btn').click(function() { var selections = $('#table').bootstrapTable('getSelections'); console.log('Selected rows:', selections); }); ``` 这段代码中,我们使用 `getSelections` 方法获取所有选中数据,并将其输出到控制台。 注意,复选框选中状态并不会影响数据的获取,所以无需特别处理复选框。如果需要,你可以在数据中添加一个 `checkbox` 属性,用于标识该是否被选中。以下是一个示例: ```javascript $('#btn').click(function() { var selections = $('#table').bootstrapTable('getSelections'); for (var i = 0; i < selections.length; i++) { selections[i].checkbox = true; } console.log('Selected rows:', selections); }); ``` 这段代码中,我们遍历选中数据的数组,并为每个数据添加一个 `checkbox` 属性,用于标识该是否被选中

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值