• extjs中rowEditing动态编辑


    我们在使用Grid的rowEditing插件时希望能够根据自己的业务需求能够动态的实现那一列是用户可以编辑的,那一列用户不可编辑,下面给出一个方案能够实现rowEditing的动态编辑功能。

    之前我通过rowEditing的beforeedit事件获得它的行对象来控制列是否可编辑,这样做之后效果是实现了,但是之后它又会被置为可编辑,以此想到我们直接控制grid的editor配置,控制这个edior的readOnly属性,在数据grid的store数据显示之前,肯定会触发事件,这样我们在事件里面来改变grid的editor配置。

    下面这段代码是我在一个按钮中控制rowEditing的动态编辑:

     1 xtype: 'button',
     2 text: '添加',   
     3 tooltip: '添加',
     4 cls : 'x-btn-text-icon', 
     5 icon: '../images/extjs/add.png',
     6 handler: function(){
     7                         
     8    //判断当前是引入操作的数据还是查询的数据
     9    var opertype = false;//是不是引入操作
    10    jinmgl_grid_store.each(function(record){
    11        if(parseInt(record.get('id')) < 0){
    12            opertype = true;
    13        }
    14    });
    15    if(opertype){
    16        Ext.Msg.alert("提示信息", "请点击查询按钮查询数据!");
    17        return false;
    18    }                    
    19                         
    20    //将所有信息都置为可以编辑的
    21    if(typeof(rowEditingOfJinmgl.grid) != "undefined"){
    22        for(var i=0; i<rowEditingOfJinmgl.grid.columns.length; i++){
    23          var editor = rowEditingOfJinmgl.grid.columns[i];
    24           if(typeof(editor.editor) != "undefined"){
    25               editor.editor.readOnly = false;
    26           }
    27        }
    28    }
    29    if(typeof(rowEditingOfJinmgl.editor) != "undefined"){
    30        for(var i=0; i<rowEditingOfJinmgl.editor.items.items.length; i++){
    31            var editor = rowEditingOfJinmgl.editor.items.items[i];
    32            if(typeof(editor) != "undefined"){
    33                rowEditingOfJinmgl.editor.items.items[i].readOnly = false;
    34            }
    35        }
    36    }
    37                         
    38    rowEditingOfJinmgl.cancelEdit();
    39    var newRow = Ext.create('jinmgl_grid_data',{
    40        id: '0',
    41        operatedate : Ext.getCmp('operateDate').getValue() == null ? Ext.Date.clearTime(new Date(), 'yy-mm-dd') : Ext.Date.clearTime(Ext.getCmp('operateDate').getValue(), 'yy-mm-dd'),
    42        storeposition: '',
    43        coaltype: '',
    44        supplierarea: '',
    45        supplierdep: '',
    46        amount: 0,
    47        qe: 0,
    48        ag: 0,
    49        wq: 0,
    50        sgq: 0,
    51        vdaf: 0,
    52        price: 0,
    53        comments:'',
    54        jinmid: 0
    55    });
    56    var position = jinmgl_grid_store.getCount();
    57    jinmgl_grid_store.insert(position,newRow);
    58    rowEditingOfJinmgl.startEdit(position,position);
    59 }  
  • 相关阅读:
    Angular2与Angular1的区别
    JS的浅拷贝与深拷贝
    浅谈js的事件冒泡和事件捕获
    JS中的call、apply、bind方法
    WEB前端性能优化常见方法
    开放定址法——线性探测(Linear Probing)
    分离链接法(Separate Chaining)
    概观散列函数
    散列——动机引入
    AVL重平衡细节——插入
  • 原文地址:https://www.cnblogs.com/smallrock/p/3632172.html
Copyright © 2020-2023  润新知