Extjs 4.2：自定义组件的多实例情况下的行编辑宽度问题

我有多个自定义xtype（grid）实例。其中一个已在编译时插入到一个视图中，但其他视图在afterrender事件中动态插入到其他视图中，如：

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

一切正常。问题在于行编辑插件。当我打开显示自定义网格的选项卡时，它看起来像这样（正确的一个）：

但当我打开另一个包含自定义网格实例的选项卡时，它看起来是这样的：

有人能告诉我，什么是可能的问题吗

行编辑插件的代码很简单：

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
            }
        }
    })
]

---

我终于解决了这个问题。我不知道这是唯一的还是最好的解决方案，但我通过将行编辑插件动态插入到我的自定义网格的各个实例中来解决它

因此，在动态插入网格后，我插入了行编辑插件，如：

//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

就这样。这对我有用。如果有人仍然知道更好的解决方案，请发帖子