Extjs6（七）——增刪查改之刪除

本文基於ext-6.0.0

頁面就是前面寫的那個，有不清楚的可以看一下前面寫頁面那篇。

一、在toolbar加一個刪除按鈕

{
    text:'刪除',
    iconCls:'x-fa fa-times',
    handler: 'del'
},

　　還是加一個完整的圖看一下吧：

　　

二、在controller里寫刪除函數del（一次刪除一條）

　　1、通過選擇框來選中一條數據，判斷是否選中的是一條，如果選中多條或是沒選，則彈框提示；

　　

　　2、如果選中一條，彈出是否確認窗口；

　　

　　　　其中：①buttons有YES NO CANCEL OK可選，icon有QUESTION,INFO,ERROR,WARNING可選；

　　　　　　　②按鈕對應的文本可以更改，方法如下：

        Ext.MessageBox.buttonText.ok = '哦啦';
        Ext.MessageBox.buttonText.yes = '必須滴';
        Ext.MessageBox.buttonText.no = '那哪行';
        Ext.MessageBox.buttonText.cancel = '算了吧';    

　　3、點擊確認，把后台要求的字段通過ajax傳到后台，成功則提示成功並重新加載數據，否則提示刪除異常。

全部代碼如下：

//**********刪除************
    del:function(){
        var grid = this.getView().lookupReference('personalGrid');
        var selectedKey = grid.selModel.getSelection();
        
        if (selectedKey.length != 1) {
            Ext.MessageBox.alert('提示', '請選擇一條記錄！');
        }else{
            Ext.Msg.show({
                title: '提示',
                message: '是否確認刪除？',
                buttons: Ext.Msg.YESNO,
                icon: Ext.Msg.QUESTION,
                fn: function (btn) {
                    if (btn === 'yes') {
                        var key = grid.selModel.getLastSelected().get('name');
                        Ext.Ajax.request({
                            url: URL + key,
                            success: function (response, opts) {
                                Ext.MessageBox.alert('提示', '刪除成功');
                                grid.store.reload();
                            },
                            failure: function (response, opts) {
                                Ext.MessageBox.alert('提示', '刪除異常');
                            }
                        });
                    }

                }
            })
        }
    },

 

 完。---------------------------------------

查拉圖斯特拉如是說