extjs4 - 从本地网格中删除记录

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