var BankOrderstore = new Ext.data.JsonStore //數據源({url: "../Handler/TxnRefund.ashx",totalProperty: 'ToTalRecord',root: "ResultData",listeners:{beforeload: function () {this.baseParams ={"method": "QUERYCMBCREFUND","BGWTXNID": Ext.getCmp("txtBgwTxnID").getValue(),"STATUS": Ext.getCmp("Refundstatus").getValue(),"STDATE": Ext.getCmp("txtSTDate").getValue("Y-m-d").format("Y-m-d"),"EDDATE": Ext.getCmp("txtEDDate").getValue("Y-m-d").format("Y-m-d"),start: 0,limit: m_pageSize};}},fields: ["BGWTXNID", "APPCODE", "BANKREFNUM", "REFUNDAMOUNT", "NAME", "STATUS", "NOTIFYRESULT", "APPLYDATE", "PROCESSDATE", "RECEIPTDATE", "BANKTXNAMOUNT","REFUNDTXNID"]});var check = new Ext.grid.CheckboxSelectionModel({ //checkboxsingleSelect:false, //false為可以多選sortable:true });var gvResult = new Ext.grid.GridPanel({id: "gvResult",renderTo: "dvBankRefund",title: '<% = GetLocalResourceObject("ResultsText") %>',height: 380,store: BankOrderstore,width: m_pageWidth,stripeRows: true, //斑馬線trackMouseOver: true,loadMask: { msg: '<% = GetLocalResourceObject("LoadingText") %>' },frame: true,columns:[new Ext.grid.RowNumberer(), //行號 check,{ header: '<% = GetLocalResourceObject("BgwTxnIDText") %>', dataIndex: "BGWTXNID", width: 150, sortable: true },{ header: '<% = GetLocalResourceObject("AppCodeText") %>', dataIndex: "APPCODE", width: 100, sortable: true, renderer: ConvertAppCode },{ header: '<% = GetLocalResourceObject("BankRefundText") %>', dataIndex: "BANKREFNUM", width: 180, sortable: true },{ header: '<% = GetLocalResourceObject("RefundAmountText") %>', dataIndex: "REFUNDAMOUNT", width: 80, sortable: true, renderer: function (v) { return v.toFixed(2); } },{ header: '<% = GetLocalResourceObject("RefundStatusText") %>', dataIndex: "STATUS", width: 80, sortable: true, renderer: ConvertStatus },{ header: '<% = GetLocalResourceObject("ApplyDateText") %>', dataIndex: "APPLYDATE", width: 150, sortable: true, renderer: function (v) { return getFormatDate(v, "yyyy-MM-dd HH:mm:ss"); } },{ header: '<% = GetLocalResourceObject("ProcessDateText") %>', dataIndex: "PROCESSDATE", width: 150, sortable: true, renderer: function (v) { return getFormatDate(v, "yyyy-MM-dd HH:mm:ss"); } },{ header: '<% = GetLocalResourceObject("ReceiptDateText") %>', dataIndex: "RECEIPTDATE", width: 120, sortable: true, renderer: function (v) { return getFormatDate(v, "yyyy-MM-dd HH:mm:ss"); } },{ header: '<% = GetLocalResourceObject("BankTxnAmountText") %>', dataIndex: "BANKTXNAMOUNT", width: 100, sortable: true, renderer: function (v) { return v.toFixed(2); } }],bbar: new Ext.PagingToolbar //分頁 ({pageSize: m_pageSize,store: BankOrderstore,displayInfo: true, //非要為true，不然不會顯示下面的分頁按鈕 items: ['-', { text: "確認退款", iconCls:"recheck", handler: DoRefund_Click } //就是這個底部按鈕調用的]}),ds: BankOrderstore,sm:check, //selModel這樣checkbox才能選store: BankOrderstore});gvResult.render(); //呈現//自動判斷是否全選并選中或不選中表頭的checkbox Ext.override(Ext.grid.CheckboxSelectionModel, {onMouseDown: function (e, t) {if (e.button === 0 && t.className == 'x-grid3-row-checker') { // Only fire if left-click e.stopEvent();var row = e.getTarget('.x-grid3-row');// mouseHandled flag check for a duplicate selection (handleMouseDown) call if (!this.mouseHandled && row) {//alert(this.grid.store.getCount()); var gridEl = this.grid.getEl(); //得到表格的EL對象 var hd = gridEl.select('div.x-grid3-hd-checker'); //得到表格頭部的全選CheckBox框 var index = row.rowIndex;if (this.isSelected(index)) {this.deselectRow(index);var isChecked = hd.hasClass('x-grid3-hd-checker-on');//判斷頭部的全選CheckBox框是否選中，如果是，則刪除 if (isChecked) {hd.removeClass('x-grid3-hd-checker-on');}} else {this.selectRow(index, true);//判斷選中當前行時，是否所有的行都已經選中，如果是，則把頭部的全選CheckBox框選中 if (gridEl.select('div.x-grid3-row-selected').elements.length == gridEl.select('div.x-grid3-row').elements.length) {hd.addClass('x-grid3-hd-checker-on');};}}}this.mouseHandled = false;},onHdMouseDown: function (e, t) {/** *大家覺得上面重寫的代碼應該已經實現了這個功能了，可是又發現下面這行也重寫了 *由原來的t.className修改為t.className.split(' ')[0] *為什么呢？這個是我在快速點擊頭部全選CheckBox時， *操作過程發現，有的時候x-grid3-hd-checker-on這個樣式還沒有刪除或者多一個空格，結果導致下面這個判斷不成立 *去全選或者全選不能實現 */if (t.className.split(' ')[0] == 'x-grid3-hd-checker') {e.stopEvent();var hd = Ext.fly(t.parentNode);var isChecked = hd.hasClass('x-grid3-hd-checker-on');if (isChecked) {hd.removeClass('x-grid3-hd-checker-on');this.clearSelections();} else {hd.addClass('x-grid3-hd-checker-on');this.selectAll();}}}});var getBgw = function () {if (gvResult.getSelectionModel().hasSelection()) {var record = gvResult.getSelectionModel().getSelections();var mycars = new Array();for (var i = 0; i < record.length; i++) {mycars[i] = record[i].data.REFUNDTXNID;}return mycars;} else {alert("請選擇要操作的記錄！"); }}function DoRefund_Click() {var values = getBgw();if (!values) return false; //判斷Ext.MessageBox.confirm("請確認", "是否要刪除選中的信息", function (button, text) {if (button == "yes") {Ext.Ajax.request({url: "../Handler/TxnRefund.ashx",method: "post",params: { "method": "DOREFUND", "REFUNDTXNIDS": values },success: function (response, option) {var result = Ext.util.JSON.decode(response.responseText);if (result.Flag == true) {Ext.MessageBox.alert("提示", "刪除成功");gvResult.render();} else {Ext.MessageBox.alert("提示", result.RespMessage);}},failure: function () {}});} else {return;}});}

?下面是上面說到的不太成熟的判斷是否全選并選中或不選中表頭的checkbox

//自動判斷是否全選并選中或不選中表頭的checkbox // function autoCheckGridHead() { // var hd_checker = gvResult.getEl().select('div.x-grid3-hd-checker'); // var hd = hd_checker.first(); // if (hd != null) { // if (gvResult.getSelectionModel().getSelections().length !=// gvResult.getStore().getCount()) { // //清空表格頭的checkBox // if (hd.hasClass('x-grid3-hd-checker-on')) { // hd.removeClass('x-grid3-hd-checker-on'); //x-grid3-hd-checker-on // //gvResult.getSelectionModel().clearSelections(); // } // } else { // if (gvResult.getStore().getCount() == 0) { //沒有記錄的話清空; // return; // } // hd.addClass('x-grid3-hd-checker-on'); // gvResult.getSelectionModel().selectAll(); // } // }// }

?

轉載于:https://www.cnblogs.com/hongdada/archive/2013/01/07/2849220.html

總結

以上是生活随笔為你收集整理的Extjs checkbox 多删除的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。