extjs4グリッド - 行単位で列エディターを変更する

Question

ExtJS4グリッドは、列ごとに適切なエディター（cellEditorまたはrowEditor）を予期します。 カラムのヘッダフィールドがdateFieldの場合、日付セレクタはそのカラムのすべてのローに適用されます。

私が必要とするのは、列ごとではなく、行ごとに異なるフィールドエディタを持つエディタです。

Extjs3ソリューションが提供されていますhere - 残念ながらExtjs4のケースには適合しません。 （説明を参照するにはリンクを確認してください。まだ画像を投稿できません）

property gridという単一の列解決策もありますが、もう1列しかサポートしておらず、標準のExtから大きく外れています。グリッドコンポーネント

column.fieldをカスタマイズしてgrid.editingPlugin.editorをリロードすることでグリッドエディタを手動で変更しようとしましたが、フィールドがない空のrowEditorパネルが表示されます。

//by default rowEditor applies textField to all cells - I'm trying to force custom numberFiled on apropriate row 
var numberField=Ext.form.field.Number(); 
grid.columns[0].field=numberField; 
//destroy current rowEditor's instance 
delete grid.editingPlugin.editor; 
//now, upon doubleClick on apropriate cell it should reinitialize itself (initEditor()) - and it does, but is an empty panel 

私はここで何が欠けていますか？私はeditingPlugin.editorのすべてを削除すると呼ばれるような、初めてのrowEditor中に最初から始めるが、それはすべてのフィールド

Answer 1

Ext4のためのソリューション緩める必要があります。

私はこのための解決策を探していたとしこの男は、プロパティのグリッドは、この動作があると述べた。 私は私のためにきれいな方法でinitComponentに を動作するように適応している私は、宣言：

this.editors = { 
'date' : Ext.create('Ext.grid.CellEditor', { field: Ext.create('Ext.form.field.Date', {selectOnFocus: true})}), 
'string' : Ext.create('Ext.grid.CellEditor', { field: Ext.create('Ext.form.field.Text', {selectOnFocus: true})}), 
'number' : Ext.create('Ext.grid.CellEditor', { field: Ext.create('Ext.form.field.Number', {selectOnFocus: true})}), 
'int' : Ext.create('Ext.grid.CellEditor', { field: Ext.create('Ext.form.field.Number', {selectOnFocus: true})}), 
'boolean' : Ext.create('Ext.grid.CellEditor', { field: Ext.create('Ext.form.field.ComboBox', { 
    editable: false, 
    store: [[ true, 'Sim' ], [false, 'Não' ]] 
})}) 
}; 

私は（コピー）私を助けるために、これらの機能を使用：

this.renderCell = function(val, meta, rec) { 
    var result = val; 
    if (Ext.isDate(val)) { 
     result = me.renderDate(val); 
    } else if (Ext.isBoolean(val)) { 
     result = me.renderBool(val); 
    } 
    return Ext.util.Format.htmlEncode(result); 
}; 

this.getCellEditor = function(record, column) { 
    return this.editors[record.get('type')]; 
}; 

そして最後に、これらの機能を関連付けますカラムへ：用事

{text: "Valor", name : 'colunaValor', width: 75, sortable: true, dataIndex: 'valor', width:200, 
    renderer: Ext.Function.bind(this.renderCell, this), 
    getEditor: Ext.Function.bind(this.getCellEditor, this) 
}