layui 数据表格 删除
时间: 2023-08-08 14:08:24 浏览: 125
对于layui数据表格的删除操作,你需要进行以下步骤:
1. 在layui表格中,为每一行的删除按钮绑定点击事件,可以通过给按钮添加lay-event属性来实现,例如:
```html
<th lay-data="{field:'operation', toolbar: '#barDemo'}"></th>
<!-- ... -->
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delete">删除</a>
</script>
```
2. 在JavaScript代码中,监听删除按钮的点击事件,并获取对应行的数据和索引,然后发送删除请求到后端:
```javascript
table.on('tool(test)', function(obj){
var data = obj.data; // 当前行数据
var index = obj.tr.data('index'); // 当前行索引
if(obj.event === 'delete'){
layer.confirm('确定删除该数据吗?', function(index){
// 发送删除请求到后端,可以使用Ajax或其他方式
// ...
// 删除成功后,重新加载表格数据
table.reload('tableId'); // tableId为表格渲染时的id
layer.close(index);
});
}
});
```
以上是使用layui实现数据表格删除的基本流程,你可以根据具体需求进行修改和调整。
阅读全文