layui表格怎么绑定tr的id
时间: 2024-04-29 08:21:56 浏览: 8
在 layui 表格中,可以使用 table.render() 方法来渲染表格,同时也可以在该方法中指定表格每一行(tr)的 id。具体实现步骤如下:
1. 在 html 中创建一个表格,并为每一行(tr)指定一个唯一的 id,如下所示:
```html
<table id="demo" lay-filter="test">
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>城市</th>
</tr>
</thead>
<tbody>
<tr id="1">
<td>张三</td>
<td>18</td>
<td>北京</td>
</tr>
<tr id="2">
<td>李四</td>
<td>20</td>
<td>上海</td>
</tr>
<tr id="3">
<td>王五</td>
<td>22</td>
<td>广州</td>
</tr>
</tbody>
</table>
```
2. 在 js 中使用 table.render() 方法来渲染表格,并为每一行(tr)指定 id,示例如下:
```javascript
//渲染表格
table.render({
elem: '#demo',
url: '/demo/table/user/',
cols: [[
{field:'username', title: '姓名'},
{field:'age', title: '年龄'},
{field:'city', title: '城市'}
]],
//指定每一行(tr)的 id
id: 'testTable',
//每一行(tr)渲染完成后的回调函数
done: function(res, curr, count){
//遍历每一行(tr)
$('tbody tr').each(function(index, item){
//获取该行的数据
var row = res.data[index];
//为该行(tr)指定 id
$(item).attr('id', row.id);
});
}
});
```
在上面的示例中,我们使用了 table.render() 方法来渲染表格,并且为每一行(tr)指定了 id。同时,我们在 done 回调函数中遍历每一行(tr),并为其指定了对应的 id。这样,在后续操作中,我们就可以通过指定 id 来获取对应的行数据了。