2016-10-03 36 views
0

我有一個帶拖放和行編輯插件的網格。當它是一個外部類時,它就被罰款了。然而,由於我將網格從一個類中分離出來並作爲內部組件,它開始給我帶來錯誤。如果我註釋掉有關插件的代碼,它可以正常工作。ExtJS 6.2無法將插件添加到內部網格 - TypeError:視圖未定義

Ext.define('Dashboards.view.widgets.barChartAndLine.BarChartAndLineWidgetForm', { 

    extend: 'Dashboards.view.widgets.WidgetBaseForm', 

    xtype: 'barChartAndLineWidgetForm', 



    items : [{ 
      xtype: 'grid', 
      rowEditing: null, 
      viewConfig: { 
       plugins: { 
        ptype: 'gridviewdragdrop' 
       } 
      }, 
     listeners: { 
      drop: function() { 
       this.updateData(); 
      } 
     }, 

     initComponent: function() { 
      var me = this; 
      this.rowEditing = Ext.create('Ext.grid.plugin.RowEditing', { 
       clicksToMoveEditor: 1, 
       autoCancel: false, 
       listeners: { 
        edit: function() { 
         me.updateData(); 
        } 
       } 
      }); 
      this.plugins = [this.rowEditing]; 
      this.callParent(arguments); 
     }, 

     store: { 
      fields : ['label', 'linevalue', 'barvalue'], 
      bind : { 
       data : '{widget.data.data.items}' 
      } 
     }, 

     columns: [{ 
      header: 'Pavadinimas', 
      dataIndex: 'label', 
      flex: 3, 
      editor: { 
       allowBlank: false 
      } 
     }, { 
      xtype: 'numbercolumn', 
      header: 'Stulpelio reikšmė', 
      dataIndex: 'barvalue', 
      flex: 1, 
      editor: { 
       xtype: 'numberfield', 
       allowBlank: false 
      } 
     }, { 
      xtype: 'numbercolumn', 
      header: 'Linijos reikšmė', 
      dataIndex: 'linevalue', 
      flex: 1, 
      editor: { 
       xtype: 'numberfield', 
       allowBlank: false 
      } 
     }, { 
      xtype: 'actioncolumn', 
      width: 30, 
      items: [{ 
       iconCls: 'x-fa fa-trash', 
       tooltip: 'Pašalinti', 
       handler: function(g, ri, ci) { 
        var grid = this.up().up(); 
        grid.getStore().removeAt(ri); 
        grid.getStore().sync(); 
       } 
      }] 
     }], 

     tbar: [{ 
      xtype: 'button', 
      text: 'Pridėti', 
      handler: function() { 
       var grid = this.up().up(); 
       var r = { 
        label: 'label', 
        linevalue: '0', 
        barvalue: '0' 
       }; 
       var modelResult = grid.getStore().insert(0, r); 
      } 
     }] 

    }] 
}); 

回答

1

除了在initComponent函數中添加rowediting插件,您可以使用網格的配置來設置插件。

根據您的代碼有遠程數據,我創建了一個fiddle來測試視圖,您可以將視圖結構與您的數據一起應用。

如果您有任何問題,請告訴我。

相關問題