手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery Easyui学习之datagrid 动态添加、移除editor
jQuery Easyui学习之datagrid 动态添加、移除editor
摘要:使用easyui行编辑的时候完成编辑的功能比较简单,但是如果要根据一个框的值动态改变别的值或者编辑的时候禁用某个框的时候就比较麻烦了。比如像...

使用easyui行编辑的时候完成编辑的功能比较简单,但是如果要根据一个框的值动态改变别的值或者编辑的时候禁用某个框的时候就比较麻烦了。

比如像下面这样:添加行的时候每个值都是手动输入,修改的时候第一个值不能修改。我们来看下怎么实现这样的效果。

jQuery Easyui学习之datagrid 动态添加、移除editor1

easyui本身是不提供这么细节的功能的,需要我们自己拓展下:

在编辑的时候移除第一列的editor属性,添加的时候,添加第一列的属性。

//扩展datagrid:动态添加删除editor $.extend($.fn.datagrid.methods, { addEditor : function(jq, param) { if (param instanceof Array) { $.each(param, function(index, item) { var e = $(jq).datagrid('getColumnOption', item.field); e.editor = item.editor; }); } else { var e = $(jq).datagrid('getColumnOption', param.field); e.editor = param.editor; } }, removeEditor : function(jq, param) { if (param instanceof Array) { $.each(param, function(index, item) { var e = $(jq).datagrid('getColumnOption', item); e.editor = {}; }); } else { var e = $(jq).datagrid('getColumnOption', param); e.editor = {}; } } });

调用:

移除:

$("#dg").datagrid('removeEditor','cardNo');//这里的cardNo是需要移除editor的列的field值

添加:

$("#dg").datagrid('addEditor',[ //添加cardNo列editor {field:'cardNo',editor:{ type:'textbox', options:{ required:true, validType:'length[3,3]', invalidMessage:'请输入3位号码!' } } }]

别的操作都可以据此拓展.

【jQuery Easyui学习之datagrid 动态添加、移除editor】相关文章:

JavaScript中用于四舍五入的Math.round()方法讲解

JavaScript中的toUTCString()方法使用详解

原生JS和JQuery动态添加、删除表格行的方法

学习javascript文件加载优化

Javascript动态创建表格及删除行列的方法

jquery.validate使用时遇到的问题

基于JavaScript实现动态添加删除表格的行

jQuery插件datepicker 日期连续选择

卡拉 OK 字幕效果

jQuery获取字符串中出现最多的数

精品推荐
分类导航