datagrid 批量删除

最新推荐文章于 2024-04-14 14:22:58 发布

Generationofdonglin

最新推荐文章于 2024-04-14 14:22:58 发布

阅读量239

点赞数

CC 4.0 BY-SA版权

文章标签： js easyui

本文链接：https://blog.youkuaiyun.com/Generationofdonglin/article/details/114261773

本文介绍如何在EasyUI DataGrid中实现批量删除功能，并确保只在前端进行操作而不涉及后台处理。通过复制选中项并逐个删除，避免了循环过程中因数据长度变化导致的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

datagrid toolbar 批量删除，只进行前端页面的删除，不进入后台处理。

toolbar: [{
   text: '删除',
   iconCls: 'icon-remove',
   handler: function () {
     var rows = $('#result').datagrid('getSelections');
     var copyRows=[];
     for(var j=0;j<rows.length;j++){
         copyRows.push(rows[j]);
     }
     if (copyRows.length > 0) {
        $.messager.confirm('请确认', '真的要删除选择的项目吗？', function (b) {
          for (var i = 0; i < copyRows.length; i++) {
            var row = copyRows[i];                  
            $('#result').datagrid("deleteRow",$('#result').datagrid("getRowIndex", row));
          }
          $("#count").html($('#result').datagrid('getData').total);
        });
     }else {
          $.messager.alert("操作提示", "请至少选择一行进行删除！");
     }

    }
}]

需要把选中的行rows进行复制成copyRows，而不能直接对rows循环，进行deleteRow属性操作，这样只能删除一个选中的行，删除之后，row的大小变了，循环会出问题。