必须配置 type: 'radio' 列且仅一列,否则 table.on('radio(filter)') 不触发;该事件回调中 obj.data 为当前页被点中行数据,obj.value 为其唯一标识,obj.checked 恒为 true。
必须配置 type: 'radio' 列,且只能有一列
不加这行配置,table.on('radio(filter)') 事件永远不会触发——不是 bug,是前提条件。layui 不会把 checkbox 列自动转成单选,写错 type 值(比如写成 'radios' 或漏掉引号)就根本不会渲染圆点。
常见错误:在 cols 里放了两列 {type: 'radio'},或和 {type: 'checkbox'} 混用,会导致事件绑定失效、UI 错乱甚至控制台报错 Uncaught TypeError: Cannot read property 'checked' of undefined。
-
type: 'radio'必须显式写在cols[0]或靠左位置;如果用了fixed: 'left',它得是第一个固定列,否则可能被遮挡或点击无响应 - 不要在
templet里手写<input type="radio">—— Layui 会接管并清空checked属性,导致状态不同步 - name 属性由 Layui 自动统一管理,你不用也不该手动指定;value 默认取
lay-id,若原始数据有id字段则优先用它
table.on('radio(filter)') 回调里直接拿 obj.data,别查 checkStatus()
这个事件只在用户点击 radio 圆点时触发,回调参数 obj 里自带完整行数据:obj.data 是当前被点中的那一行原始数据(字段仅限 cols 中定义的),obj.value 是该行唯一标识(通常是 id),obj.checked 恒为 true(单选下取消选中不走这个事件)。
别用 table.checkStatus('filter').data[0] 去取——它只返回当前页已勾选的行,而单选模式下没有“多选集合”,且初始化默认选中时这个方法也拿不到数据。
- 想获取整行所有字段(包括未在
cols中定义的),得查table.cache['filter'],再按obj.value匹配 - 如果表格启用了分页,
obj.data仍是当前页的数据对象,不是全量缓存;跨页操作需自己维护 ID 映射 - 事件不会在
setRowChecked()调用后自动触发,除非你手动加callbackFlag: true参数
让某行初始就选中,不能靠数据字段加 checked: true
Layui 对 radio 模式不支持像 checkbox 那样在原始数据里加字段来驱动默认选中。所谓“初始化即选中”,必须在 done 回调里动手脚。
最稳妥做法:先等表格渲染完成,在 done 里查 table.cache['filter'] 找到目标行对象,给它加 lay-checked="true" 属性,再调 table.checkStatus('filter') 强刷 UI 状态(仅适用于 2.8+)。
- 用
setRowChecked('filter', {index: N, checked: true})也可以,但N是从 0 开始的行下标,翻页后下标会变,容易错位 - 如果目标行不在当前页(比如第 3 页的某条),
setRowChecked无法定位,必须配合table.reload({page: {curr: 3}})先跳转 - 别在
render前往 data 数组里塞lay-checked: true—— 渲染时会被忽略,无效
想点击整行就选中?rowClickToCheck: true 不起作用
rowClickToCheck: true 只对 checkbox 列生效,对 radio 列完全无效。Layui 官方不支持“点击整行触发 radio 选中”这种行为,这是明确的设计限制,不是兼容性问题。
真要实现,得监听 row(filter) 事件,然后手动模拟点击对应 radio 元素,或调用 setRowChecked() 强制设置。但要注意:手动触发会绕过原生 radio 互斥逻辑,必须自己清空其他行状态。
- 监听
row(filter)后,用obj.data.id查table.cache找到该行 DOM,再触发其内部 radio 的 click 事件(需确保 radio 已渲染) - 更可靠的方式是:在
row回调里调table.setRowChecked('filter', {index: obj.tr.index(), checked: true}),并提前用table.clearCache('filter')清掉旧状态 - 如果表格用了 toolbar 或自定义操作列,点击这些区域会触发
row事件,但你不希望它们触发选中——得在回调里加if (obj.event === 'click') { ... }过滤
obj.value,并在每次 done 回调里重新 set。


















