EasyUI对treegrid编辑方法简单介绍

我心飞翔 分类:实例代码

下面是一段EasyUI中编辑treegid的方法的代码实例。非常的简单,比较适合初学者参考学习,代码如下:

主从表,从表是一个treegrid,加载完数据后,点击节点进入编辑状态。

columns : [ [ {
  title : "ID",
  field : "id",
  hidden : true
}, {
  field : "pid",
  hidden : true
}, {
  title : "AAA",
  field : "aaa",
  width : 70,
  align : "center",
  halign : "center"
}, {
  title : "BBB",
  field : "bbb",
  width : 70,
  align : "center",
  halign : "center",
  editor : {
    type : "combobox",
    options : {
    data : [ {
      "id" : 0,
      "text" : "苹果"
    }, {
      "id" : 1,
      "text" : "梨子"
    } ],
    valueField : 'id',
    textField : 'text',
    editable : false,
    // required : true,
    panelHeight : "auto",
    missingMessage : "请选择水果",
    onSelect : function(record) {
      //editingId是进入编辑状态行的id
      var editors = $('#grid').datagrid('getEditors', $('#editingId').val());
      if(record.id == 1){//选择梨子
        var feditor = editors[1];//一行中第二个编辑框
        //将编辑框设置成必填
        $(feditor.target).validatebox({required:true});
        //将编辑框设置成可编辑
        $(feditor.target).numberbox('enable');
        var feditor2 = editors[2];//一行中第三个编辑框
        $(feditor2.target).validatebox({required:true});
      }
          else if(record.id == 0){//选择苹果
        var feditor = editors[1];
        $(feditor.target).validatebox({required:false});
        $(feditor.target).validatebox("setValue","");
        $(feditor.target).numberbox('disable');
        var feditor2 = editors[2];
        $(feditor2.target).validatebox({required:false});
        $(feditor2.target).validatebox("setValue","");
       }
     },
   }
 }
}]]

回复

我来回复
  • 暂无回复内容