Extjs 4.2：カスタムコンポーネントの複数のインスタンスの場合の行編集の幅の問題

Question

私のカスタムxtype（グリッド）のインスタンスが複数あります。そのうちの一つは、コンパイル時に1つのビューに挿入されているが、他は動的に似afterrenderイベントで他のビューに挿入されています

var cmp = Ext.getCmp('secondTab'); 
cmp.insert(cmp.items.length, {xtype: 'customGrid', id:'customGrid2'}); 

すべてが正常に動作しています。問題はrowEditingプラグインにあります。私は私のカスタムグリッドが存在するタブを開くと、この（正しい）のようになります。

しかし、私はまた私のカスタムグリッドのインスタンスが含まれているいくつかの他のタブを開いたときには、次のようになります。

誰かが何が可能に問題になることを教えてもらえますか？行編集プラグインの

コードは単純です：

plugins: [ 
     Ext.create('Ext.grid.plugin.RowEditing', { 
     pluginId: 'rowEditing', 
     autoCancel: false, 

     // Preventing editing mode by click on any cell 
     onCellClick: function (view, cell, colIdx, record, row, rowIdx, e){} , 
     startEditByClick: function(){}, 
     onEnterKey: function(){}, 

     // Listening various event of plugin 
     listeners: { 

      /** 
      * @event edit 
      * Fires after a editing 
      * Calling respective controller method. 
      * @param {Ext.grid.plugin.Editing} editor 
      */ 
      edit: function(editor, e) { 
       // I am calling my controller method here to add a new record in this grid code is pasted here 

       var store = Ext.getStore('teilgewerke_store_neu'); 
       var r = Ext.create('MyApp.model.MyModel',{'name': "", 'date':"", 'text' : ""}); 
       store.proxy.url = "someUrl"; 
       var result = store.add(r); 

       var rowEditingPlugin = Ext.getCmp(this.viewParentId).getPlugin('rowEditing'); 

       rowEditingPlugin.startEdit(r); 

      }, 

      /** 
      * @event canceledit 
      * Fires when the user started editing but then cancelled the edit. Enable the Hinzufaugen Button and reload the grid. 
      * @param {Ext.grid.plugin.Editing} editor 
      */ 
      canceledit: function(editor, context, eOpt){ 

       //My own logic to enable disable stuff 
      } 
     } 
    }) 
] 

Answer 1

私は最終的にこの問題を解決することができました。私はこれが唯一または最良の解決策であるかどうかはわかりませんが、行編集プラグインを私のカスタムグリッドのさまざまなインスタンスに動的に挿入することによって解決しました。それだ

//code for row editing plugin given in my question but just for sample 
var plugin = Ext.create('Ext.grid.plugin.RowEditing', { 

     onCellClick: function (view, cell, colIdx, record, row, rowIdx, e){} , 
     startEditByClick: function(){}, 
     onEnterKey: function(){}, 

     listeners: { 
      edit: function(editor, e) { 
       //Whatever you want to do 
      } 
     } 
    }) 

var myGrid = Ext.getCmp('instanceOfMyCustomGrid'); 
plugin.init(myGrid); //This is important while dynamically inserting plugin 
myGrid.plugins = []; // If there is no other plugin for your grid, create an empty plugin array 
myGrid.plugins[0] = plugin; //Insert your plugin 

：

そこで、グリッドの動的挿入した後、私のようなプラグインを編集する行を挿入します。それは私のために働いた。誰かがもっと良い解決策をまだ知っているなら、親切に投稿してください。