V20301 – [刪除]鈕, - checkboxModel -刪除勾選的多筆資料 - 覆蓋原本event的處理 - 移除目前 store 資料

 目的:  [刪除]鈕,  -刪除勾選的多筆資料 - checkboxModel 

處理說明:  1>將 grid_Single 換成 checkboxModel class

                   2> 重寫 btn_del.onclick 處理 , 即  beforedel() 傳回 false, 不處理 parent.del 函式

                   3> 依勾選的資料, 一筆一筆從資料庫刪除 , 資料庫刪除後, 再刪除畫面的資料

1>*.js

 1>>置換成 CheckboxModel  class

    //加入 checkbox Model 

    Ext.getCmp('grid_Single').destroy(); //20220905

    var grid_Single = Ext.create('grid_Single', {

        id: 'grid_Single',

        resizable: true,

        selModel: Ext.create('Ext.selection.CheckboxModel', {

            selectionMode: 'SIMPLE',

            listeners: {

                /*selectionchange: function (cb, selected, eOpts) {

                    //view.selModel.getSelection()

                },*/

                RowMouseDown: function (view, record, item, index, e) {

                    var me = this;

                    if (index !== -1) {

                        if (!me.allowRightMouseSelection(e)) {

                            return;

                        }

                        if (e.shiftKey && me.lastFocused) {

                            me.selectRange(me.lastFocused, record, e.ctrlKey);

                            me.processSelection(view, record, item, index, e);

                        }

                        if (!me.isSelected(record)) {

                            me.mousedownAction = true;

                            me.processSelection(view, record, item, index, e);

                        } else {

                            me.mousedownAction = false;

                        }

                    }

                }

            }

        })

    });

    Ext.getCmp('tab2').add(grid_Single); //將grid加入到tab裡面

    Ext.getCmp('tab2').updateLayout();

 2>>重寫 btn_del.onclick 處理 , 即  beforedel() 傳回 false, 不處理 parent.del 函式

//20220922  覆蓋原本的 [刪除]鈕 處理,  自行處理
    //不執行 paretn.delete , beforeDel 傳回 false
    Ext.getCmp('btn_del').beforeDel = function () {
        return false;
    }

    var buttonModel = Ext.create('G_buttonModel');   //取得 目前的畫面狀態(1,2,3 : 新增/編輯/瀏覽)

    Ext.getCmp("btn_del").on('click', function (me,e,eOpts) {    

      //已置換 grid_store , 不需 .getView().
     //var cur_recs = Ext.getCmp('grid_Single').getView().getSelectionModel().getSelection(); 
        var cur_recs = Ext.getCmp('grid_Single').getSelectionModel().getSelection();
        var cur_rec;
        if (cur_recs.length == 0)
        {
            buttonModel.modelType = 0;
            mywarnalert('請先勾選要刪除的資料!!');
        }
        else {
            me.delMessage = "確定刪除勾選的資料嗎?";
            Ext.Msg.confirm('提醒', me.delMessage, callBackFunc);
            function callBackFunc(id) {
                if (id == 'yes') {
                    console.log("cur_recs.length:", cur_recs.length);
                    var gridstore = Ext.getCmp('grid_Single').store;                        

                    for (let i = 0; i <= cur_recs.length - 1; i++) {
                        console.log("i:", i);
           Ext.getCmp('grid_Single').getSelectionModel().select(cur_recs[i]); //grid select指向所選的資料
                        if (Ext.getCmp('btn_del').afterDel() == false) {
                            return;
                        }                                                
                    } //  end of for (let i=0,)
                    //資料庫均刪除完成後, 才由 gridstore 移除資料
                    for (let i = 0; i <= cur_recs.length - 1; i++) {
                        gridstore.remove(cur_recs[i]); //畫面上隱藏刪除列                     
                    } //  end of for (let i=0,)
                    Ext.getCmp('grid_Single').getView().refresh();
                    buttonModel.modelType = 0;
                }  // end    if (id == 'yes')             
            }  // end of callbackfunc
        }  //else { of if length>0            
    } ) // end of click function