Extjs控件EditorGridPanel中使用自定义的editor

点击EditorGridPanel中的某一列时，需要根据点击的那一行的其它列的数据进行判断，出现何种表单控件。

例如：

头像类型       头像ID

xxx                   yyy

点击yyy时需要根据头像类型选择的值进行判断，是出现combox控件还是textfield控件。

 

解决方案：使用Extjs预留的getCellEditor进行扩展。

部分代码：

var _cm = new Ext.grid.ColumnModel([

   new Ext.grid.RowNumberer(), {//行号

        width:xx,

       editor:new Ext.form.Numberfield(),

       header:"xx",

       sortable:true,

       dataIndex:"xx",

       allowBlank:false

   }

]);

var _sm = new Ext.grid.CheckboxSelectionModel({singleSelect : false });//不允许一次选中多行

var _ds = new Ext.data.Store({
   baseParams : {'m' : "list"},
   proxy : GameOIS.getHttpProxy("/cgi/xxxx"),
   reader : new Ext.data.JsonReader({
    root : "data",
    successProperty : "data"
   }, [

   "xxx"

]),
   autoLoad : false
});

var _grid = new Ext.grid.EditorGridPanel({
   autoScroll : true,
   stripeRows : true,//隔行换色
   border : true,
   height : 350,
   clicksToEdit : true,
   enableDragDrop : false,
   loadMask : true,
   bodyStyle : "",
   layoutConfig : {forceFit : true},

   ds : _ds,
   cm : _cm,
   sm : _sm,
   listeners : {
    beforeedit : function(e) {
   //e.field 获取当前点击的字段名称，返回true或flase 可允许或中止调用editor方法

    },
    afteredit : function(e) {
     //提交：e.record.commit(); 回溯： e.record.reject(); e.field
     }
}

_grid.getColumnModel().getCellEditor = function(colIndex, rowIndex) {
        var field = this.getDataIndex(colIndex);//获得当前列的的dataIndex
        if (field == 'NHeadId') {//点击需要改变以列
        var headType = _grid.getStore().getAt(rowIndex).get('SHeadType');
          

if (/^[12]$/.test(headType)) {//此对象发生改变的前提条件
            if(headType == "1") {
                   return new Ext.grid.GridEditor(new Ext.form.ComboBox(itemConvert({
                          'type' : 'xx',
                           'hiddenName' : 'NHeadId'
                })));
     } else if(headType == "2") {
      return new Ext.grid.GridEditor(new Ext.form.ComboBox(itemConvert({
       'type' : 'combo',
       'hiddenName' : 'xxxxx',
       'comboData' : data      })));
     }
            }
        }
   return Ext.grid.ColumnModel.prototype.getCellEditor.call(this, colIndex, rowIndex);
}