754 分类:

ZUI数据表格添加按钮点击事件

看到官方论坛里有这样的问题

以前项目中使用的是数据表格1,现在想升级改造成数据表格2,表格中有一栏是操作栏,有一些功能性按钮(图片传不上来...);

按照实例给的写法:

dataSource: {
         cols:[
             {name: 'btn', label: 'ID', width: 200},
         ],
         array:[
               {btn:'<button>删除</button>'}
        ]
 }
html标签被直接解析成字符串了,页面上直接显示'<button>删除</button>'
请问要怎么才能把按钮添加进去

看下官方解释
html: 默认为 false,如果设置为 true,则在渲染所匹配单元格时将内容作为 html 源码更新到页面上;

我尝试使用对话框,按钮上加属性是可以显示,但是函数生成内容那块,写到外层怎么也不行,哦后来想到应该写到dataGrid的onRender事件里,等渲染出表格再加载。但很遗憾还是不行,最后尝试直接添加按钮点击事件,再使用触发器对象来显示对话框。

先试了jQuery的click,结果不行,又看到给动态添加的元素添加js事件,不能直接添加js事件,需要借助on( )方法,给选择器指定的子元素添加事件处理函数,并非选择器本身;

$('body').on('click','ul>li',function(){
            console.log($(this).html());
        });

我试了怎么只能触发一次,倒是在其他的WebUI上发现直接在html上添加的onclick可行。但我想这个jQuery怎么来操作。最后看到了$(document).on是可行的。当时我就猜想是数据表格的行选择功能导致的,但也没关过,今天在本地html例子上试了下把checkByClickRow设为false,发现上面 的指定子元素可行。

可以将 checkByClickRow 选项设置为 false,这样只有用户点击勾选框才能够切换选中状态。此时上面的那指定子元素事件可行。

但是在数据表格中的onRender里添加的这段,会导致出发两次事件,搜了下在使用前off()一下就可以了。

又试了下,上面指定父元素的方法,这个checkByClickRowtrue时用class为行上的datagrid-row datagrid-row-cell或是格上的datagrid-cell datagrid-cell-cell这些父元素时是可以触发的,需要放在datagrid的onRender事件里。

#none

作者: 站长

版权: 除特别声明,均采用BY-NC-SA 4.0许可协议,转载请表明出处

目录Content

评论