基于Interactive Grid列值禁用APEX$ROW_SELECTOR的方案咨询

目前Oracle APEX官方确实没有提供直接基于列值禁用APEX$ROW_SELECTOR的配置项，但可以通过JavaScript结合Interactive Grid（IG）的模型事件实现这个需求，以下是具体方案：

核心实现思路 #

通过监听IG的行初始化/数据更新事件，获取每行的列值，判断后直接操作DOM元素禁用对应的行选择器（复选框/单选按钮）。

具体代码实现 #

1. 页面加载时绑定行初始化事件（处理初始加载的行） #

假设你的IG静态ID为emp_ig，需要根据status列的值（例如值为Inactive时禁用选择器），在页面的Execute when Page Loads中添加以下代码：

// 获取IG实例
const igInstance = apex.region('emp_ig').widget().interactiveGrid('getViews','grid');

// 监听行初始化事件，每行加载时触发
igInstance.model.subscribe({
    event: 'rowInit',
    callback: (event, data) => {
        const rowRecord = igInstance.model.getRecord(data.row);
        // 替换为你的目标列名和判断条件
        if (rowRecord.status === 'Inactive') {
            // 定位该行的选择器元素
            const selectorElement = document.querySelector(`tr[data-record-id="${rowRecord[igInstance.model.idAttribute]}"] input[name="APEX$ROW_SELECTOR"]`);
            if (selectorElement) {
                selectorElement.disabled = true;
                // 可选：添加样式区分禁用状态
                selectorElement.parentElement.style.opacity = '0.5';
            }
        }
    }
});

2. 添加行数据更新监听（处理列值动态变化的情况） #

如果需要在用户修改列值后实时更新选择器的禁用状态，补充以下代码：

// 监听行数据更新事件
igInstance.model.subscribe({
    event: 'rowUpdate',
    callback: (event, data) => {
        const rowRecord = igInstance.model.getRecord(data.row);
        const selectorElement = document.querySelector(`tr[data-record-id="${rowRecord[igInstance.model.idAttribute]}"] input[name="APEX$ROW_SELECTOR"]`);
        if (!selectorElement) return;
        
        // 根据更新后的列值设置禁用状态
        selectorElement.disabled = rowRecord.status === 'Inactive';
        selectorElement.parentElement.style.opacity = selectorElement.disabled ? '0.5' : '1';
    }
});

注意事项 #

• 确保代码中的列名（如status）是IG模型中实际使用的字段名，而非页面上的列显示标签。
• 该方案支持复选框和单选按钮两种选择模式的IG，选择器input[name="APEX$ROW_SELECTOR"]对两种模式都有效。
• 分页加载或IG刷新后，rowInit事件会自动触发，无需额外处理重新绑定。

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