博客
关于我
JS实现删除行按钮只有一行时不能删除
阅读量:572 次
发布时间:2019-03-11

本文共 1350 字,大约阅读时间需要 4 分钟。

为了避免填报过程中不小心删除第一行导致无法提交的问题,我们需要对删除按钮的逻辑进行控制。以下是实现该效果的具体方法和思考过程。

问题描述

在某些填报场景中,用户有时候可能会误删第一行为移动至末尾或删除全部数据,导致无法正常提交。删除第一行为ubiquitin化会影响系统的稳定性和数据完整性。

解决方案

我们可以通过条件设置来控制第一行的删除权限,或者通过JS脚本逻辑控制按钮状态。

方法一:使用JS实现

  • 数据集设置

    • 打开模板文件,在数据库查询部分修改数据集 accused Limit 1条记录,方便测试使用。
    SELECT * FROM 表名 LIMIT 1
  • 模板设置

    • 在B3单元格中添加插入行按钮,设置为不可用状态。
    • 在M3单元格添加删除行按钮,设置为不可用状态。
  • 添加JS事件

    • 打开模板属性,进入JS事件设置。
    • 确定需要保护的行数(如第一行),设置按钮控件是否可用。
    • 示例代码:
  • var arr = ["sc1"]; // 控件名称为sc1for (let j = 0; j < arr.length; j++) {    let self = contentPane.getWidgetsByName(arr[j]);    let flag = 0;    for (let i = 0; i < self.length; i++) {        let tr = self[i].element.parent().parent().css("display");        if (tr == "table-row") {            flag++;        }    }    if (flag == 1) {        for (let i = 0; i < self.length; i++) {            let tr2 = self[i].element.parent().parent().css("display");            if (tr2 == "table-row") {                self[i].setEnable(false);            }        }    } else {        for (let i = 0; i < self.length; i++) {            self[i].setEnable(true);        }    }}
    1. 模板保存
      • 完成设置后,保存模板并选择填报预览模式。
    2. 方法二:使用条件属性

    3. 去掉JS事件

      • 采用条件属性设置删除按钮状态,避免编写额外JS代码。
    4. 条件属性设置

      • 将删除行按钮的属性设置为:默认不可用,使用公式 row()=3 限制第三行及以上的删除权限。
    5. 模板优化要点

      • 可读性:结构清晰的代码和逻辑描述,便于后续维护。
      • 可扩展性:支持多个删除按钮,依次赋予不同的名字(如sc2, sc3等)。
      • 避免重复:删除第一行按钮状态的设置,每一行都用唯一条件限定。

      技术总结

      通过条件设置或JS脚本控制删除按钮的逻辑,可以有效防止误删第一行为问题,提升填报系统的稳定性。选择其中一种方案根据实际需求灵活应用。

    转载地址:http://uwhvz.baihongyu.com/

    你可能感兴趣的文章
    链上钱包的博彩雷区
    查看>>
    GRUB2
    查看>>
    解决RHEL6 vncserver 启动 could not open default font 'fixed'错误.
    查看>>
    微信JS-SDK DEMO页面和示例代码
    查看>>
    XYNUOJ
    查看>>
    Chrome查找发请求的js之黑箱调试
    查看>>
    CMCC登录参数分析
    查看>>
    GridView的另外一种分页方式,可提高加载速度
    查看>>
    一些错误记录
    查看>>
    GridView自定义删除操作
    查看>>
    http常见响应状态码
    查看>>
    Nginx Location
    查看>>
    解决github Git clone 慢的问题
    查看>>
    一张图搞定RPC框架核心原理
    查看>>
    Scala中的包
    查看>>
    参加阿里的Java面试经验
    查看>>
    Python微信公众号
    查看>>
    他来了他来了,他带着云栖大会的免费门票走来了
    查看>>
    Oracle笔记
    查看>>
    如何复用外部shell脚本
    查看>>