1. 程式人生 > >easyui datagrid 動態加入、移除editor

easyui datagrid 動態加入、移除editor

params text invalid ava strong print ram type options

使用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