removeByUniqueId根据唯一字段(主键字段)删除数据。参数id:唯一字段(主键字段)对应的值
参数名称 | 参数说明 |
id | 唯一字段(主键字段)对应的值 |
//设置Id字段为唯一字段
$('#table').bootstrapTable({
toolbar:"#toolbar",
uniqueId:"Id",
data:data,
columns: columns,
});
//删除Id为11的数据
$('#table').bootstrapTable('removeByUniqueId',11);
copy
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <script src="https://www.itxst.com/package/jquery-3.3.1/jquery.js"></script> <link href="https://www.itxst.com/package/bootstrap-4.3.1/css/bootstrap.css" rel="stylesheet" /> <link href="https://www.itxst.com/package/bootstrap-table-1.15.3/bootstrap-table.css" rel="stylesheet" /> <script src="https://www.itxst.com/package/bootstrap-table-1.15.3/bootstrap-table.js"></script> <title>bootstrap table removeByUniqueId在线例子</title> <style> .table-demo { width: 80%; margin: 30px auto 0px auto; } .titles { float: right; clear: both; } </style> </head> <body> <div id="toolbar"> <button onclick="del()">删除第Id为11的数据</button> </div> <div class="table-demo"> <table id="table" ></table> </div> <script> //设置需要显示的列 var columns = [ { checkbox:true }, { field:"Id", title: 'ID' }, { field: 'catalog', title: '分类' } ]; var data= [{ Id: 11, catalog: 'catalog 001', }, { Id: 12, catalog: 'catalog 002', }, { Id: 13, catalog: 'catalog 003', } ]; //设置唯一字段 $('#table').bootstrapTable({ toolbar:"#toolbar", uniqueId:"Id", data:data, columns: columns, }); function del() { $('#table').bootstrapTable('removeByUniqueId', 11); } </script> </body> </html>
copy