easyui實現datagrid多行刪除功能
阿新 • • 發佈:2018-12-09
效果圖:
F12瀏覽器檢視執行資訊:
html頁面: singleSelect:false,checkOnSelect: true
js:(溫馨小提示:注意根據自己實現刪除的方法去呼叫哦~ 我的多行刪除在delete裡面)
$(function () { var datagrid = $('#dataGrid'); //資料展示 //為所有有data-method的元件新增事件 $("*[data-method]").on("click",function(){ zhengqing[$(this).data("method")]() }) //防止汙染 CRUD window.zhengqing = { delete:function(){ //getSelected:返回第一個被選中的行或如果沒有選中的行則返回null。 //getChecked:在複選框唄選中的時候返回所有行。(該方法自1.3版開始可用) var row = datagrid.datagrid("getChecked");//獲取勾選的資料 if (row){ //多行刪除 $.messager.confirm('確定','是否確定<span style="color: red;font-size: 20px;">刪除'+row.length+'條</span>資料??',function (r) { for (var i = row.length - 1; i >= 0; i--) { if (r){ $.get("/employee/delete",{id:row[i].id},function (result) { if (result.success){ //刪除成功 datagrid.datagrid("reload");//重新整理頁面 reload:刪除之後會在當前頁面 當刪除本頁所有資料之後會跳到前一個頁面 }else { //刪除失敗 $.messager.alert('提示','此資料刪除失敗:<br />'+result.msg,"info"); } }) } } }); }else { $.messager.alert('提示','請選擇一條資料進行刪除',"warning"); } } })