SurveyJS动态面板中如何获取修改的问题名称

在SurveyJS表单库的使用过程中，开发人员经常会遇到需要获取动态面板(Dynamic Panel)内部修改的具体问题名称的需求。本文将详细介绍如何正确实现这一功能。

问题背景

当使用动态面板时，面板内部包含多个问题(questions)。如果直接使用onValueChanging事件监听器，开发者只能获取到动态面板本身的名称，而无法得知具体是面板内部的哪个问题被修改了。例如，当修改动态面板中的"numberOfDays"问题时，事件返回的是动态面板名称"actionPanel"，而不是具体的"numberOfDays"。

解决方案

SurveyJS提供了专门用于处理动态面板值变化的事件监听器SurveyModel.onDynamicPanelItemValueChanged。这个事件监听器能够精确捕获动态面板内部各个问题的值变化情况。

实现方式

survey.onDynamicPanelItemValueChanged.add((survey, options) => {
    console.log("被修改的问题名称:", options.question.name);
    console.log("新值:", options.value);
    console.log("旧值:", options.oldValue);
    console.log("所在面板项索引:", options.panelIndex);
});

参数说明

• options.question: 被修改的具体问题对象
• options.value: 问题的新值
• options.oldValue: 问题的旧值
• options.panelIndex: 问题所在面板项的索引位置

注意事项

1. 该事件只会在动态面板内部的问题值发生变化时触发
2. 相比普通的onValueChanging事件，它提供了更详细的变化信息
3. 如果需要同时监听普通问题和动态面板问题，可以结合使用两种事件监听器

实际应用场景

这种精细化的值变化监听在以下场景特别有用：

1. 表单数据验证：可以根据具体修改的问题进行针对性校验
2. 数据联动：当某个问题值变化时，自动更新相关问题的状态
3. 审计日志：记录用户对表单的每一次修改细节
4. 条件逻辑：基于特定问题的变化触发不同的业务逻辑

通过使用onDynamicPanelItemValueChanged事件，开发者可以更精确地控制动态面板的行为，实现更复杂的表单交互逻辑。