Question

我使用Array Store中的本地数据创建了一个可编辑的网格。现在我放了一个actionColumn来从商店中删除记录。但删除没有发生，记录仍然存在。请参阅下面的代码： -

    this.empdata = [
                [ 'Anea etet','andreeas@jhggf.com','active' ],
            [ 'Bharfdna ivasdsh','bfanas@dsgfsd.com','active' ],                    
            [ 'Crfg gfdgdtt', 'ffigh@dfsd.com', 'away' ],
            [ 'Gfdgdis Perron','geffgsp@fdhd.com', 'away' ]
       ];

    this.employee = new Ext.data.ArrayStore({
        autoSync: true,

        fields : [ {
            name : 'name'
        }, {
            name : 'email'
        }, {
            name : 'status'
        }],
        data : this.empdata
    });


    var cm = new Ext.grid.ColumnModel([{
        header: 'Name',
        dataIndex: 'name',
        flex: 1,
        editor: {
           allowBlank: false
        }
    }, {
        header: 'Email',
        dataIndex: 'email',
        flex: 1,
        editor: {
            allowBlank: false,
            vtype: 'email'
        }
    }, {
        header: 'Status',
        dataIndex: 'status', 
        editor: {
            allowBlank: false               
        }

    }, {
        xtype: 'actioncolumn',
        width: 50,
        items: [
            {
                icon   : 'src/images.jpg',             
                tooltip: 'Delete record',
                handler: function(grid, rowIndex, colIndex) {
                    var rec = grid.getStore().getAt(rowIndex);
                    alert("Delete " + rec.get('name'),function(btn,text){
                        if (btn == 'ok'){
                            grid.getStore().removeAt(rowIndex);
                            grid.getStore().sync();
                        }
                    })
                }
         }]
    }]);

    this.grid = new Ext.grid.EditorGridPanel({
        store: this.employee,
        cm: cm,
        xtype: 'editorgrid',
        title: 'Employee Data',
        clicksToEdit: 1,
        frame: true,
        stripeRows : true,
        width: 1000,
        height: 500,
        region: 'south',

        viewConfig : {
            forceFit : true,
            scrollOffset : 0,
        }                       
    });


    this.grid.on('validateedit', function(e) {

            if (e.field === 'status'){
                if(!((e.value === 'active')||(e.value === 'away')||(e.value === 'offline'))){
                    e.cancel = true;
                    e.record.data[e.field] = e.originalValue;
                }
            }
    });



    var win = {
            layout: {
                type: 'vbox',
                align: 'center',
                pack: 'top',
                padding: 30
            },
        items: [this.grid]          
    };



    Ext.apply(this, win);

当我点击删除按钮时，会出现一个弹出窗口，要求确认。当我点击'确定'时，它应该删除记录，但没有任何反应。请说明代码有什么问题。

Answer 1

您在yor处理程序中使用alert它只接受一个参数 - 消息。如果您想要确认，最好的方法是使用Ext.Msg.confirm。例如：

handler: function(grid, rowIndex, colIndex) {
    var rec = grid.getStore().getAt(rowIndex);
    Ext.Msg.confirm(
        "Delete " + rec.get('name'),
        "Delete " + rec.get('name'),
        function(btn){
            if (btn == 'yes'){
                grid.getStore().removeAt(rowIndex);
                grid.getStore().sync();
            }
        }
    );
}

从可编辑网格中的商店中删除记录

1 个答案: