jQuery Easyui學習之datagrid 動態(tài)添加、移除editor
使用easyui行編輯的時候完成編輯的功能比較簡單,但是如果要根據(jù)一個框的值動態(tài)改變別的值或者編輯的時候禁用某個框的時候就比較麻煩了。
比如像下面這樣:添加行的時候每個值都是手動輸入,修改的時候第一個值不能修改。我們來看下怎么實現(xiàn)這樣的效果。

easyui本身是不提供這么細節(jié)的功能的,需要我們自己拓展下:
在編輯的時候移除第一列的editor屬性,添加的時候,添加第一列的屬性。
//擴展datagrid:動態(tài)添加刪除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 = {};
}
}
});
調(diào)用:
移除:
$("#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位號碼!'
}
}
}]
別的操作都可以據(jù)此拓展.
相關(guān)文章
javascript開發(fā)中使用onpropertychange,oninput事件解決onchange事件的不足
用onpropertychange,oninput事件解決onchange事件的不足,需要的朋友可以參考下。2010-11-11
jQuery學習筆記(1)--用jQuery實現(xiàn)異步通信(用json傳值)具體思路
這是一個簡單的POST 請求功能以取代復雜 $.ajax,請求成功時可調(diào)用回調(diào)函數(shù),感興趣的朋友可以參考下哈,希望對你有所幫助2013-04-04
jQuery下通過replace字符串替換實現(xiàn)大小圖片切換
實現(xiàn)的效果有點類似于Google picasa相冊不同尺寸圖片的切換效果。本實例通過文字大?。╢ont-size)控制圖片尺寸的做法是跟Google學習的,但是jQuery代碼是根據(jù)效果自己想出來的,邏輯很簡單,沒有什么精妙之處2012-05-05
DIV+CSS+jQ實現(xiàn)省市聯(lián)動可擴展
這篇文章主要介紹了DIV+CSS+jQ實現(xiàn)省市聯(lián)動可擴展方法的相關(guān)資料,非常不錯具有參考借鑒價值,需要的朋友可以參考下2016-06-06
JQuery入門——事件切換之hover()方法應(yīng)用介紹
謂切換事件,即有兩個以上的事件綁定于一個元素,在元素的行為動作間進行切換,有兩個方法用于事件的切換,一個方法是hover(),另一個是toggle(),感興趣的朋友不妨了解下,或許對你有所幫助2013-02-02

