layui的treeTable插件表格树表格行单击点击事件绑定不生效

layui版本：v2.5.6

treeTable版本：2.x

按照官方文档，dom标签如下：

<table id="zzglTab" lay-filter="zzgl"></table>

js渲染和绑定事件：

    layui.config({base: '${basePath}'}).extend({treeTable: 'static/treeTable/treeTable'}).use(['treeTable'], function () {var treeTable = layui.treeTable;treeTable.render({id: 'zzid',elem: '#zzglTab',tree: {iconIndex: 0,  // 折叠图标显示在第几列idName: 'zzid',  // 自定义id字段的名称pidName: 'pzzid',  // 自定义标识是否还有子节点的字段名称haveChildName: 'haveChild',  // 自定义标识是否还有子节点的字段名称isPidData: true  // 是否是pid形式数据},cols: [{field: 'zzmc', title: '组织名称', width: 380},{field: 'zzlx', title: '组织类型', width: 250},{field: 'zzrs', title: '人员数', width: 250},],reqData: function (data, callback) {// 在这里写ajax请求，通过callback方法回调数据$.ajax({url: "${basePath}/jcsjgl/zzjggl!getZzjg.do",data: data,type: "POST",dataType: "json",success: function (result) {   callback(result.data);}});}});//监听行单击事件treeTable.on('row(zzgl)', function (obj) {console.log(123);alert(obj.tr) //得到当前行元素对象console.log(obj.tr) //得到当前行元素对象console.log(obj.data) //得到当前行数据//obj.del(); //删除当前行//obj.update(fields) //修改当前行数据});});

但是发现行点击事件死活不起作用，各种查文档，百度，Google，无果。无意间看到一篇博文，写的demo中table标签的id和lay-filter的值一样，于是灵光乍现，将行事件绑定的row后面括号中的值换为了table标签的id值。。。

        //监听行单击事件treeTable.on('row(zzglTab)', function (obj) {console.log(123);alert(obj.tr) //得到当前行元素对象console.log(obj.tr) //得到当前行元素对象console.log(obj.data) //得到当前行数据//obj.del(); //删除当前行//obj.update(fields) //修改当前行数据});

就这么神奇的生效了。。

官方文档中说的row后面括号中的值是lay-filter的值，但是自己测试发现应该是table标签的id值。不知道是版本的问题还是哪里姿势有问题？确实是改成id值行点击事件才生效。

layui的treeTable插件表格树表格行单击点击事件绑定不生效相关推荐

动态创建表格给同一个标签创建点击事件并让点击事件操作内容不一样
动态创建表格给同一个标签创建点击事件,每个点击事件操作的元素不一样. 现在有这样的需求,点击"查看详细"显示或隐藏标签.要实现这样的效果就要给点击标签添加两个属性,一个属性是nam ...
button layui 点击事件_解决layui中的form表单与button的点击事件冲突问题
解决layui中的form表单与button的点击事件冲突问题 layui的form表单位置和button标签的位置重合,会使得button的click事件得不到响应,如图: 蓝色底为form的位置, ...
GridView/DataGrid行单击和双击事件实现代码_.Net教程
功能: 单击选中行,双击打开详细页面说明:单击事件(onclick)使用了 setTimeout 延迟,根据实际需要修改延迟时间 ;当双击时,通过全局变量 dbl_click 来取消单击事件的响应 ...
elementUI table表格行添加点击事件
1.table 事件 2.使用方法 <el-table :data="popBusinessData" border style="margin-top: 10px ...
对表格的td标签执行点击事件
对于表格中的td如何执行事件 html: <table id="example" > <thead> <tr> <th>编号< ...
layui 表格行单击事件选中行前的单选框
layui表格中,行点击事件同时选中行前的单选框. //表格监听行单击事件table.on('row(test)', function(obj) {//选中行前radioTable.isCheckRa ...
miniui单元格点击弹框_miniui 给表格行添加监听事件的几种方法以及点击某列列名数据不能排序的问题...
最近在使用miniui框架做开发,在做表格行的点击监听事件中发现了几个属性,都可以起到监听效果但是执行的结果却大有不同.好了废话不多说,直接上代码. autoload="true" ...
JAVA_树状表格分页(layUI、treeTable.js)
效果图展示(PS:本人很懒,刚开始想在网上随意找一个就用,后来发现好像PHP的不少,JAVA的树状表格大多数跟我开始写的一样没有分页,导致数据量过大后加载过于缓慢被客户吐糟,最后没找到合适的就自己写了 ...
layui循环数据并渲染_layui使用表格渲染获取行数据的例子
需求:使用前端框架layui生成表格,点击表格中一行数据中的按钮,获取到这行数据. 解决办法: 在render中增加字段: done: function (res, curr, count) { // ...
js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable
js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable 参考文章: (1)js插件---JS表格组件BootstrapTable行内编辑解决方案x-editable ...

layui的treeTable插件表格树表格行单击点击事件绑定不生效

layui的treeTable插件表格树表格行单击点击事件绑定不生效相关推荐

最新文章

热门文章