Bootstrap Table中的多选框删除功能
更新时间：2018年07月15日 14:44:08 作者：Fly_tom
这篇文章主要介绍了Bootstrap Table中的多选框删除功能，非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
先上代码，后面再进行详细解释：
//删除按钮事件
$("#remove").on("click", function () {
// $("#table").bootstrapTable('getSelections');为bootstrapTable自带的，所以说一定要使用bootstrapTable显示表格,#table：为table的id
var rows = $("#table").bootstrapTable('getSelections');
console.log(rows);
if (rows.length == 0) {// rows 主要是为了判断是否选中，下面的else内容才是主要
alert("请先选择要删除的记录!");
return;
} else {
var arrays = new Array();// 声明一个数组
$(rows).each(function () {// 通过获得别选中的来进行遍历
arrays.push(this.cid);// cid为获得到的整条数据中的一列
});
var idcard = arrays.join(','); // 获得要删除的id
console.log(idcard);
}
})
1. 效果图
2. 获得要删除的数据
接下来，再来看一下这一行代码的效果，把rows打印到控制台：
可以看到选中删除后，获得到的，就是一条完整重数据库中的查询内容，其中的cid就为每一条数据的id（主键）。
先选中多选框，当点击删除按钮时：在控制台接收到选中的cid，当然后台数据中一定要传递icd来，cid可以不用显示在表格中，
把idcard打印出来，
这时我们获得到的idcard 就是一个我们想要的到的数据，同时给他们中间以逗号隔开，传递到后台，执行多行删除语句：
3. 传递数据到后台执行删除sql
这时就可以成功获得要删除整条数据的id，当然你也可以获得其他列的数据，例如：
注意！
执行上面的功能，一点是要用bootstrapTable 显示的表格，要不然，没有效果，
总结
以上所述是小编给大家介绍的Bootstrap Table中的多选框删除功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
相关文章
这篇文章主要介绍了javascript中函数作为参数调用的方法,实例分析了函数作为操作调用的原理与相关技巧,需要的朋友可以参考下2015-02-02
下面小编就为大家带来一篇js实现点击切换checkbox背景图片的简单实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-05-05
记得以前在学校的时候,例如要修改信息,需要要修改的部分的值显示出来,都是先把数据传到后台,然后再在前台显示的,想想真够笨的,这个可以在客户端就实现的,何必要传到后台呢2009-05-05
当点击提交后，提交按钮变灰色不可用，这样可有效防止重复提交，本代码就是实现这样一个功能2013-09-09
这篇文章主要为大家详细介绍了JScript实现简单的表格操作，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
虽然精通jquery，但对它的原型javascript却不是很了解，最近在学习javascript中遇到了一些困难，比如冒泡和捕获，很多次被提到，但又不知究竟应用在何处。找到了一些好文章解惑，在这里分享给大家2014-04-04
uniapp是一个支持多端的技术,因此它是兼容性比较强的,而且速度也很快,下面这篇文章主要给大家介绍了关于uniapp微信小程序左上角返回按钮监听的相关资料,需要的朋友可以参考下2022-04-04
本文主要分享了原生js实现返回顶部缓冲效果的示例代码。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要介绍了js事件触发操作,结合实例形式分析了javascript事件触发机制原理、使用方法及相关操作注意事项,需要的朋友可以参考下2019-06-06
今天通过一个案例给大家分享微信小程序连续签到7天积分获得功能，通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考价值，感兴趣的朋友一起学习吧2020-08-08
最新评论