根据字段值变更动态显示/隐藏submit button的实现方案咨询

需求说明 #

页面提交按钮默认隐藏，仅当指定字段取值从under waiting变更为accepted或refused时才显示，常规动态动作Show/Hide配置失效。

具体实现步骤 #

1. 配置按钮初始隐藏（解决加载闪屏问题） #

不要依赖动态动作在页面加载时执行Hide动作隐藏按钮，会因为渲染顺序问题出现按钮闪露的bug：

• 找到目标Submit按钮，进入属性面板
• 找到服务器端条件选项，条件类型选择PL/SQL表达式，表达式内容填1=2
• 保存配置，页面首次渲染时按钮会直接在服务端输出为隐藏状态，没有前端延迟。

2. 配置正确触发逻辑的动态动作 #

之前Show/Hide失效90%的原因是触发判断逻辑没写对，没有同时校验初始值和当前值：

• 新建动态动作，事件选择更改(Change)，选择对象选你要监听的目标字段，不要选页面加载、失去焦点这类事件，Change事件会在字段值真正提交更新后触发，不会拿到旧值。
• 找到客户端条件配置项，条件类型选JavaScript 表达式，输入以下判断代码，注意将代码里的PXXX_YOUR_FIELD替换为你实际的页面项ID：

const fieldItem = apex.item("PXXX_YOUR_FIELD");
const currentVal = fieldItem.getValue().trim().toLowerCase();
const originVal = fieldItem.getOriginalValue().trim().toLowerCase();
// 必须同时满足：初始值是under waiting，当前值为accepted/refused
return originVal === "under waiting" && ["accepted", "refused"].includes(currentVal);

• 配置真动作：选择显示(Show)，操作对象选择你的Submit按钮，勾选动作配置里的「触发元素更改时刷新JavaScript事件」，避免按钮显示后绑定的提交事件失效。
• 配置假动作：选择隐藏(Hide)，操作对象同样选择目标Submit按钮，处理用户把值改回其他状态的场景，保证按钮状态和字段值逻辑一致。

常见配置失效原因排查 #

如果你按上面配置还是不生效，逐一排查以下问题：

• 没有校验初始值：只判断当前值是否为accepted/refused，会导致页面加载时如果字段本身值就是accepted，按钮直接显示，不符合「从under waiting变更」的要求
• 值匹配没做兼容：字段值可能带前后空格、大小写不统一，直接做全等判断会匹配失败
• 触发事件选错：选了按键按下、鼠标点击类事件，触发时字段值还没更新，拿到的是旧值
• 前端校验被绕过：建议在按钮对应的提交处理过程里加一层服务端校验，判断字段值的变更轨迹，避免用户通过浏览器控制台修改按钮显示状态非法提交。

内容的提问来源于stack exchange，提问作者Retal Omar