easyui datagrid 动态加入移除editor

Posted gccbuaa

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了easyui datagrid 动态加入移除editor相关的知识,希望对你有一定的参考价值。

使用easyui 行编辑的时候完毕编辑的功能比較简单,可是假设要依据一个框的值动态改变别的值或者编辑的时候禁用某个框的时候就比較麻烦了。
比方像以下这样:加入行的时候每一个值都是手动输入,改动的时候第一个值不能改动。我们来看下怎么实现这种效果。
技术分享

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位号码!‘
                }
            }
        }]

别的操作都能够据此拓展.
(完)






以上是关于easyui datagrid 动态加入移除editor的主要内容,如果未能解决你的问题,请参考以下文章

EasyUI datagrid数据表格加载本地数据

求教easyui datagrid如何动态生成列

easyui datagrid 怎么动态获取到表头的名称

easyUi动态生成datagrid列

easyui datagrid 动态操作editor 的方法

EasyUI DataGrid动态修改列标题