jQuery EasyUI — 重写datagrid的combotree编辑类型

来源：互联网发布：网络语言拔草什么意思编辑：程序博客网时间：2024/04/29 02:10

1.重写combotree单选

（1）重写combotree定义代码：

// 重写combotree单选$.extend($.fn.datagrid.defaults.editors, {combotree_single : {init : function(container, options) {var box = $('<input />').appendTo(container);box.combotree(options);return box;},getValue : function(target) {var t = $(target).combotree('tree', target);var n = t.tree('getSelected');return n;},setValue : function(target, value) {if (value) {$(target).combotree('setValue', value.id);}},resize : function(target, width) {var box = $(target);box.combotree('resize', width);},destroy : function(target) {$(target).combotree('destroy');}}});

（2）调用代码：

options未使用url的请求方式，而是用data本地加载，防止每次点击列表行的时候都需要发送url远程加载。

{field:'fieldName',title:'标题',align:'center',sortable:true,resizable:true,editor:{type:'combotree_single',options:{data: getTreeData()}}, formatter:function(value,row,index){if(value) {return value.text;}}}

（3）combotree传入数据方法：

使用ajax请求的方式。

function getTreeData() {var treeData = null;$.ajax({type : 'post',url : '', // 得到数据的URL地址cache : false,async : false,dataType : 'json',data : {}, // 请求参数success : function(result) {treeData = result;}});return treeData;}

2.重写combotree复选

// 重写combotree复选$.extend($.fn.datagrid.defaults.editors, {combotree_multiple : {init : function(container, options) {var box = $('<select multiple />').appendTo(container);box.combotree(options);return box;},getValue : function(target) {var t = $(target).combotree('tree', target);var n = t.tree('getChecked');return n;},setValue : function(target, value) {if (value != undefined && value.length > 0) {var arrId = new Array();for (var i = 0; i < value.length; i++) {arrId.push(value[i].id);}$(target).combotree('setValues', arrId);}},resize : function(target, width) {var box = $(target);box.combotree('resize', width);},destroy : function(target) {$(target).combotree('destroy');}}});

0 0