Oracle APEX v24.1交互网格自定义Save按钮按需启用/禁用咨询

步骤1：设置静态ID #

• 给你的Interactive Grid设置静态ID（在IG属性面板的「Advanced」标签下），比如EMP_CHECKBOX_IG
• 给自定义Save按钮设置静态ID（按钮属性面板的「Advanced」标签下），比如IG_SAVE_BTN

步骤2：添加JavaScript监听逻辑 #

在页面的Function and Global Variable Declaration中粘贴以下代码（替换对应ID）：

$(document).ready(function() {
    // 替换为你的IG静态ID
    const igStaticId = 'EMP_CHECKBOX_IG';
    // 替换为你的Save按钮静态ID
    const saveBtnId = 'IG_SAVE_BTN';

    const igRegion = apex.region(igStaticId);
    const saveBtn = $('#' + saveBtnId);

    // 页面加载时禁用Save按钮
    saveBtn.prop('disabled', true);

    // 监听IG的数据变化事件（包括复选框状态修改）
    igRegion.widget().interactiveGrid('getViews','grid').model.subscribe(
        function() {
            // 检查模型是否有未保存的更改
            const hasUnsavedChanges = igRegion.widget().interactiveGrid('getViews','grid').model.hasChanged();
            // 根据是否有更改切换按钮状态
            saveBtn.prop('disabled', !hasUnsavedChanges);
        },
        null,
        'dataChange'
    );

    // 可选：如果Clear按钮需要重置Save状态，给Clear按钮加动态动作执行以下代码
    // $('#' + saveBtnId).prop('disabled', true);
});

步骤3：验证逻辑 #

• 页面加载完成后，Save按钮默认处于禁用状态
• 点击任意复选框修改状态，Save按钮自动启用
• 如果通过Clear按钮重置网格，Save按钮会重新禁用（需给Clear按钮添加对应动态动作）

关键说明 #

• 这里利用了APEX Interactive Grid的model.subscribe方法监听dataChange事件，能准确捕获所有数据修改（包括复选框切换）
• model.hasChanged()方法会自动判断IG是否有未提交的更改，无需手动遍历复选框状态

内容的提问来源于stack exchange，提问作者Bhavin Adhvaryu