0

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

削除ボタンをクリックすると、確認を求めるポップアップが表示されます。[OK] をクリックすると、レコードが削除されるはずですが、何も起こりません。コードの何が問題なのかを提案してください。

4

1 に答える 1

2

alertyor ハンドラーで使用すると、1 つのパラメーター (メッセージ) のみが受け入れられます。確認したい場合は、 を使用するのが最善の方法です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();
            }
        }
    );
}
于 2012-12-02T20:37:37.047 に答える