Datatables在每行数据后添加删除按钮
时间: 2024-03-08 11:49:15 浏览: 18
可以使用Datatables的`columns`选项来添加自定义列,然后在自定义列中添加删除按钮。
以下是一个示例代码,使用了Datatables的`render`选项来渲染自定义列,其中包含删除按钮的HTML代码:
```javascript
$(document).ready(function() {
$('#example').DataTable( {
"columns": [
{ "data": "name" },
{ "data": "position" },
{ "data": "office" },
{ "data": "age" },
{ "data": "start_date" },
{ "data": "salary" },
{
"data": null,
"render": function ( data, type, row ) {
return '<button class="btn btn-danger btn-sm delete-row">删除</button>';
}
}
]
} );
} );
```
在上面的代码中,我们添加了一个自定义列,其中`data`选项设置为`null`,因为我们不需要从数据源中获取任何数据。然后,我们使用`render`选项来指定如何渲染自定义列。在这里,我们返回一个包含删除按钮的HTML代码的字符串。请注意,我们还为按钮添加了一个`delete-row`类,以便在单击按钮时可以轻松地识别该行。
你可以根据自己的需求来更改上面的代码,并将其应用到你的Datatables表格中。