Jquery Datatable 前端分页 Checkbox 跨页全选的问题
piaochen0 · 2021-04-19 09:34:54 +08:00 · 2056 次点击这是一个创建于 1348 天前的主题，其中的信息可能已经有所发展或是发生改变。
业务需求：
有一个主机列表，大概几百条数据，一次性发给前端，使用 DataTable 在前端进行分页后，使用 Checkbox 进行选择后，再发送给后端处理。
前端进行分页，要支持跨页全选，选择等功能。
问题：
DataTable 怎么跨页对 Checkbox 进行全选？现在发现 Datatable 其实应该有地方存储了 checkbox 的状态，推断应该找到相关的地方，设置下所有 row 对应 checkbox 的状态就可以了。但是没有找到这样的 api
第 1 条附言 · 2021-04-19 10:43:14 +08:00
我找到了一个方法，使用如下方式可以获取到每行的 html node 。
这里的，是所有的行。包括没有显示的非当前页的行，也可以获取到。
$('#table').DataTable().row(0).node()
然后查找 input，获取 checkbox
$($('#table').DataTable().row(0).node()).find('input')
设置 checkbox 的选中状态就可以了
$($('#table').DataTable().row(0).node()).find('input').prop("checked", is_checked)
使用
$('#table').DataTable().rows().count()获取所有行的 count,遍历一下就可以了。
多谢各位。
这里的，是所有的行。包括没有显示的非当前页的行，也可以获取到。
$('#table').DataTable().row(0).node()
然后查找 input，获取 checkbox
$($('#table').DataTable().row(0).node()).find('input')
设置 checkbox 的选中状态就可以了
$($('#table').DataTable().row(0).node()).find('input').prop("checked", is_checked)
使用
$('#table').DataTable().rows().count()获取所有行的 count,遍历一下就可以了。
多谢各位。
 |
1
lichdkimba 2021-04-19 09:38:48 +08:00
localstorage 强行存状态？
|
 |
2
maocat 2021-04-19 09:39:36 +08:00
localstorage
|
 |
3
piaochen0 OP @maocat #2 感觉不是 local storage 啊,浏览器调试了下，local storage 里面没有东西，清空了后，之前的状态还是在的
|
 |
4
muunala10221 2021-04-19 09:51:45 +08:00
全选设置一个单独变量存储 ，翻页根据变量状态设置勾选与否
|
|
5
maocat 2021-04-19 09:53:56 +08:00
@piaochen0 你没理解到，localstorage 是你自己将状态封装进去，而不是他给你存好了，比如
你做了 localstorage.setItem("123", 456 ） 在你页面刷新后，你依旧可以取出这个值 localstorage.getItem("123"）// 456 当然你还有许多细节需要处理，比如第一次进入页面的时候 localstorage 对应的数据应该是空的 |
 |
6
kop1989 2021-04-19 09:58:05 +08:00
lz 说的 dataTable 是这个么： https://datatables.net/
大概看了一下，他 api 里有一个 rows()方法，描述是选中表格中的多行，这个是不是就可以实现？ |
Select Language