从本地网格删除记录

Question

我有一个Grid在Window。当我点击该窗口的一行并单击删除按钮时，该行应该从窗口中删除。 （我想我必须remove it from Store and reload the grid, so the changes will be picked）

我无法获得点击事件并从商店中删除该行。我为此添加了按钮，但无法获取网格记录并将其从商店中删除并重新加载。

我的代码如下;像

Ext.define('MyApp.view.Boy', { 
    extend: 'Ext.window.Window', 
    alias: 'widget.boy', 
    height: 800, 
    width: 900, 
    layout: { 
     type: 'absolute' 
    }, 
    initComponent: function() { 
     var me = this; 
     Ext.applyIf(me, { 
      items: [ 
       { 
        xtype: 'gridpanel', 
        height: 500, 
        width: 800, 
        title: 'My Grid Panel', 
        store: 'School', 
        viewConfig: { 
        }, 
        columns: [ 
         { 
          xtype: 'gridcolumn', 
          dataIndex: 'Id', 
          text: 'id' 
         }, 
         { 
          xtype: 'gridcolumn', 
          dataIndex: 'name', 
          text: 'name' 
         } 
        ] 
       }, 
       { 
        xtype: 'button', 
        height: 40, 
        width: 150, 
        text: 'Remove', 
        listeners: { 
         click: { 
          fn: me.removebuttonclick, 
          scope: me 
         } 
        } 
       } 
      ] 
     }); 

     me.callParent(arguments); 
    }, 
    removebuttonclick: function(button, e, options) { 
     console.log('removebuttonclick'); 
    } 
}); 

Answer 1

东西：

Ext.define('MyApp.view.Boy', { 
    extend: 'Ext.window.Window', 
    alias: 'widget.boy', 
    height: 800, 
    width: 900, 
    layout: { 
     type: 'absolute' 
    }, 
    initComponent: function() { 
     var me = this; 
     var this.grid = Ext.widget({ 
        xtype: 'gridpanel', 
        height: 500, 
        width: 800, 
        title: 'My Grid Panel', 
        store: 'School', 
        viewConfig: { 
        }, 
        columns: [ 
         { 
          xtype: 'gridcolumn', 
          dataIndex: 'Id', 
          text: 'id' 
         }, 
         { 
          xtype: 'gridcolumn', 
          dataIndex: 'name', 
          text: 'name' 
         } 
        ] 
       }); 
     Ext.applyIf(me, { 
      items: [ 
       this.grid, //oopsie 
       { 
        xtype: 'button', 
        height: 40, 
        width: 150, 
        text: 'Remove', 
        listeners: { 
         click: { 
          fn: me.removebuttonclick, 
          scope: me 
         } 
        } 
       } 
      ] 
     }); 

     me.callParent(arguments); 
    }, 
    removebuttonclick: function(button, e, options) { 
    var me = this; 
    Ext.Array.each(this.grid.getSelectionModel().selected,function(record, index,selectedRows){ 
      me.grid.getStore().remove(record); 
     }); 
    } 
});