如何在Ext JS中的“编辑器网格面板”中添加“保存”按钮？

Question

我需要在编辑器网格面板中添加一个“保存”按钮。我尝试的一切都行不通。谢谢你的帮助。这是我的代码。

var iLineItemGrid = new Ext.grid.EditorGridPanel({
    id: 'iLineItemStore',
    store: iLineItemStore,
    cm: iLineItemCM,
    cls: 'iLineItemGrid',
    width: 'auto',
    height: 'auto',
    frame: true,
    //title:'Edit Plants?',
    //plugins:checkColumn,
    clicksToEdit:1,
    viewConfig: {
        //forceFit: true
        autoFit:true
    },        
    tbar:  [{
        text: 'Add',
        tooltip:'Add the line item',
        handler : function(){
            var r = new iLineItemRec({
                i_line_item_name: '',
                i_line_item_amt: ''
            });
            iLineItemGrid.stopEditing();
            iLineItemStore.insert(0, r);
            iLineItemGrid.startEditing(0, 0);
        },
        //Should this be scope:this or scope:iLineItemGrid?
        scope:iLineItemGrid
    }, {
        text: 'Delete',
        tooltip:'Remove the selected line item',
        handler: function(){
            iLineItemGrid.stopEditing();
            var r = iLineItemGrid.getSelectionModel().getSelectedCell();
            iLineItemStore.removeAt(r[1]);
        },
        //Should this be scope:this or scope:iLineItemGrid?
        scope:iLineItemGrid
    }],
    //MIKE SAVE BUTTON
    buttons: [{
        text: 'Save',
        tooltip: 'Click to save all changes to the database',
        handler: function() {
            iLineItemStore.each(function(record) {
                Ext.Ajax.request({
                    url: 'UpdateInvoiceDataAction.do',
                    //ADD AN ALERT TEXT HERE TO TEST IT
                    success: function() {
                        iLineItemGrid = false;
                        Ext.MessageBox.hide();
                        Ext.MessageBox.alert('Success', 'This record has been saved');
                    },
                    failure: function() {
                        iLineItemGrid.isLoaded = false;
                        cmh.display(action.result);
                    },
                    callback: function(records, options, success) {
                        //SOMEWHERE IN HERE POPULATE THE 'AMOUNT DUE' textfield
                        //How do I set this value?
                        Ext.getCmp('iAmountDue').setValue(Toa.Application.invId)
                    },
                    params: record.data
                });
            }
            )
        },
        //Should this be scope:this or scope:iLineItemGrid?
        scope:iLineItemGrid
    }]            
});