防止填报第一行数据被删除

1.1 问题描述

存在插入删除行按钮的模板，如果只剩一行数据时点击了删除行，那后续就无法再新增行了，因为页面上没有插入行按钮了。那么如何实现第一行数据禁用删除行按钮呢？

1.2 实现思路

方案一：插入删除行后，条件属性会重新计算，所以可以利用条件属性来判断第一行，并禁用删除行按钮。

注：方案一适用于第一行固定，不需要删除的场景，支持移动端。

方案二：插入删除行后，页面的加载结束事件会重新执行，所以可以在加载结束事件中使用JS获取页面行数，判断为1时禁用删除按钮。接口说明可以参考：填报预览专有

注：方案二适用于第一行不固定，需要也能删除的场景，不支持移动端。

2.1 准备数据

新建数据集ds1，从FRDemo取数，sql语句为：SELECT * FROM S产品 limit 3

2.2 设计模板

如图所示设计模板，D2为插入行按钮，E2为删除行按钮。

2.3 方案一：条件属性

为 E2 单元格的「删除行按钮」添加条件属性。条件属性的类型为「控件」，设置为删除行按钮控件且不可用。公式条件为：row()=2，代表第二行的「删除行按钮」不可用。如下图所示：

2.4 方案二：加载结束事件

1）给E2单元格的删除行按钮设置控件名称为sc，并设置为不可用。

2）点击模板>模板 Web 属性>填报页面设置，选择「为该模板单独设置」，增加一个「加载结束」事件

JavaScript 代码如下：

var arr = ['sc'];
//定义需要执行事件的删除行按钮名称数组，如有多组则写法为['sc1','sc2']
for (i = 0; i < arr.length; i++) {
	var kj = $('[widgetname="' + arr[i].toUpperCase() + '"]:visible');
	//获取页面上可见的删除行按钮元素
	var sc = _g().getWidgetsByName(arr[i].toUpperCase());
	//根据名字获取删除行按钮
	for (j = 0; j < sc.length; j++) {
		kj.length <= 1 ? sc[j].setEnable(false) : sc[j].setEnable(true);
		//当控件只剩1个时，禁用控件，否则遍历启用所有控件
	}
}

2.5 效果预览

2.5.1 方案一

PC端：

移动端 ：

2.5.2 方案二

PC端：

移动端 ：不支持

方案一：填报第一行数据不可删除-方案一.cpt

方案二：填报第一行数据不可删除-方案二.cpt