ExtJS4 - ファイルアップロードエディタをGridに追加するには？

Question

3列のグリッドを作成したい。 1つの列は「テキストフィールド」で、他の2つの列は「ファイルフィールド」としてエディタを設定するイメージです。イメージカラムでは、レンダラーを使用してイメージを表示できますが、新しいイメージを編集または追加する場合は、ブラウズボタンを押してイメージをブラウズすることはできません。ここに私のコードです。

var grid = Ext.create('Ext.grid.Panel', { 
    title: 'Author', 
    store: Ext.data.StoreManager.lookup('authorStore'), 
    renderTo: 'authorGrid', 
    columns: [{ 
     header: 'Name', 
     dataIndex: 'name', 
     editor: { 
      xtype: 'textfield', 
     } 
    }, { 
     header: 'Icon', 
     dataIndex: 'iconImage', 
     renderer: function(val) { 
      return '<img src="' + val + '">'; 
     }, 
     editor: { 
      xtype: 'filefield', 
      allowBlank: false, 
     } 
    }, { 
     header: 'Background', 
     dataIndex: 'background', 
     renderer: function(val) { 
      return '<img src="' + val + '">'; 
     }, 
     editor: { 
      xtype: 'filefield', 
      allowBlank: false, 
     } 
    }], 
    selModel: Ext.create('Ext.selection.CheckboxModel'), 
    plugins: [ 
     Ext.create('Ext.grid.plugin.CellEditing', { 
      clicksToEdit: 2 
     }) 
    ], 
    tbar: [{ 
     iconCls: 'icon-add', 
     text: 'Add', 
     handler: function() { 
      // add record 
     } 
    }, { 
     iconCls: 'icon-delete', 
     text: 'Remove', 
     handler: function() { 
      // remove selected records... 
     } 
    }, { 
     iconCls: 'icon-save', 
     text: 'Save', 
     handler: function() { 
      store.save(); 
     } 
    }] 
}); 

何が間違っていますか？このような 'ファイルフィールド'エディターを置くことはできますか？グリッドデータを保存して画像をアップロードするためにグリッド上の保存ボタンをクリックすることは可能ですか？

Answer 1

すぐに調査したところ、私はこの問題に対して簡単な解決方法を実現しませんでした。私の見解では、EditorGridはそのようなタイプの操作をサポートすることは想定されていません。 さらに、グリッド内のエディタは、ストアの対応する行の値を変更するためのものです。ファイルアップロードではファイルを操作しますが、コードで見られるように、これらのセルの文字列データを待っています。

私が提案するのは、セル内のファイルアップロードをポップアップで置き換えることです。ユーザーがセルをクリックすると、fileuploadでポップアップが開きます。彼らがファイルを選択してアップロードすると、ポップアップを閉じて、グリッドのストアにレコードを再ロードします。ちょうどアイデア！