`

easyUI datagrid表格删除行时出现编号错误的bug已解决

阅读更多

这个错误是 easyUI源码的bug,纠结了好多天,尝试了好多方法最后终于解决了,再次分享一下

easyui是根据datagrid-row-index和datagrid-row-r1-x-x来定位行的。

但在deleteRow方法中,删掉当前行后,作者只把当前行后面的行的datagrid-row-index更新了。也就是往前提1,弥补被删除行的空缺,但对datagrid-row-r1-x-x却没做任何改动。

这样就会造成下次执行 opts.finder.getTr的时候,获得的row错误,不是自己点击的row。

解决方法:

在jquery.easyui.min.js 里找到deleteRow方法,

改之后的方法为:

 

deleteRow: function(target, index) {
var opts = $.data(target, "datagrid").options;
    var data = $.data(target, "datagrid").data;
    opts.finder.getTr(target, index).remove();
    var gd = $.data(target, "datagrid");
    for (var i = index + 1; i < data.rows.length; i++) {
        opts.finder.getTr(target, i, "body", 2).attr("datagrid-row-index", i - 1)
        .attr("id",gd.rowIdPrefix+"-2-"+(i-1));
        var tr1 = opts.finder.getTr(target, i, "body", 1).attr("datagrid-row-index", i - 1)
        .attr("id",gd.rowIdPrefix+"-1-"+(i-1));
        if (opts.rownumbers) {
            tr1.find("div.datagrid-cell-rownumber").html(i);
        }
    }
    data.total -= 1;
    data.rows.splice(index, 1);
}

 

 直接复制粘贴就可以了

 

分享到:
评论

相关推荐

    easyui datagrid 表格 打印

    标题“easyui datagrid表格打印”关注的就是如何解决这个问题,即如何将经过formatter处理后的数据在打印时保持原有的格式。 在描述中提到的“支持formatter格式化数据的打印”,指的是Datagrid中用于数据美化和...

    easyui datagrid 数据导出到Excel

    在IT行业中,EasyUI Datagrid是一款基于jQuery的前端数据展示组件,它提供了丰富的表格功能,如排序、分页、过滤等。在实际工作中,我们经常需要将这些展示的数据导出到Excel文件,以便进行进一步的分析或存储。下面...

    easyui datagrid 增加鼠标悬停弹窗事件

    在本示例中,我们关注的是如何在EasyUI的Datagrid组件上添加一个特殊功能:当鼠标悬停在某一行时,弹出一个窗口显示该行的关键信息,例如用于图片预览。以下是对这个知识点的详细解释: 1. **EasyUI Datagrid**: ...

    easyui的datagrid生成合并行,合计计算价格

    在描述中提到的"easyui的datagrid生成合并行,合计计算价格",指的是如何使用EasyUI的DataGrid组件来实现表格数据的行合并以及总价的计算功能。以下是对这个知识点的详细解释: 1. EasyUI DataGrid组件: EasyUI的...

    easyui datagrid中实现上下左右、回车切换单元格

    easyui datagrid中实现上下左右、回车切换单元格easyui datagrid中实现上下左右、回车切换单元格easyui datagrid中实现上下左右、回车切换单元格

    easyui datagrid在编辑状态下更新列的值

    在使用EasyUI框架开发Web应用时,Datagrid组件是一个非常重要的元素,它提供了一种方便的方式来展示和操作数据。在标题“easyui datagrid在编辑状态下更新列的值”中,我们关注的是如何在Datagrid的编辑模式下动态地...

    扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件完整版Demo下载

    jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) Demo 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停离开事件,源码奉献!!!

    jquery easyui datagrid demo

    Datagrid 是 jQuery EasyUI 中一个强大的数据展示组件,常用于表格数据的展示和操作,支持分页、排序、过滤、编辑等功能。通过阅读这份文档,我们可以了解 Datagrid 的基本配置和高级特性,以及如何与后端数据源进行...

    easyui datagrid 删除多行操作

    easyui datagrid 删除多行操作时会出现异常,该方法可以直接加载一次数据,避免该问题的发生

    easyUI datagrid 行上移,下移,置顶,置底的方法

    easyUI datagrid 行上移,下移,置顶,置底的方法

    解决EasyUIdataGrid列比较多,无数据,列展现不全

    ### 解决EasyUI dataGrid列较多时无数据显示不全的问题 在使用EasyUI框架进行前端开发的过程中,可能会遇到dataGrid组件在数据为空时列显示不完整的问题。这不仅影响用户体验,也降低了系统的可用性。本文将详细...

    easyui datagrid 右冻结

    标题中的“easyui datagrid 右冻结”是指在使用EasyUI框架开发Web应用程序时,针对datagrid组件实现右侧列固定的功能。EasyUI是一个基于jQuery的UI库,提供了丰富的组件,包括datagrid,它是一个用于展示表格数据的...

    easyui datagrid editor回车切换单元格示例,可参考

    easyui datagrid editor回车切换单元格示例,适合熟悉easyui但又不懂如何做的人员,可能参考一下源码JS。

    easyui datagrid 多条件筛选 可复选 类似淘宝筛选

    首先,`datagrid`是EasyUI中的一个核心组件,它用于展示数据表格,支持分页、排序、过滤等多种操作。在实现多条件筛选时,我们需要对datagrid的`columns`属性进行配置,定义每一列的显示方式和筛选条件。例如,我们...

    JS EasyUI DataGrid动态加载数据

    JS EasyUI DataGrid是一款基于jQuery和EasyUI框架的数据表格组件,它提供了丰富的功能,如数据分页、排序、过滤和自定义操作等。在实际应用中,动态加载数据是DataGrid的一个重要特性,允许用户在需要时加载更多的...

    easyUI拓展:获取当前datagrid正在编辑状态的行编号

    easyUI拓展:获取当前datagrid中在编辑状态的行编号列表,直接使用即可

    EasyUI DataGrid过滤用法实例

    EasyUI 是一个基于 jQuery 的 UI 框架,它提供了丰富的组件,包括表格(DataGrid)等,使得 Web 应用程序的界面开发更加便捷。在这个"EasyUI DataGrid 过滤用法实例"中,我们将深入探讨如何利用 EasyUI 的 DataGrid ...

    easyui datagrid标题列宽度自适应

    EasyUI是一个基于jQuery的轻量级框架,提供了一系列易于使用的UI组件,包括datagrid,用于创建表格布局。 在EasyUI的datagrid中,列的宽度通常可以设置为固定、自动或自适应。固定宽度是直接设定每列的具体像素值;...

    easyui datagrid单元格tip实现

    在Easyui的1.3.3版本中,作者新增了tooltip组件,尽管样式看起来也...之前我写过一篇《扩展:datagrid鼠标经过提示单元格内容》那就是用纯编码生成的tip,更为丑陋,有了Easyui 1.3.3的tooltip,我们实现起来就很容易了

Global site tag (gtag.js) - Google Analytics