Oracle APEX 20.2交互式网格：按列值动态隐藏行选择框

问题分析 #

你之前的代码存在几个核心问题：

• 仅针对选中行获取列值，未遍历所有行处理选择框
• 错误操作了整个网格区域的显示/隐藏，而非每行的选择框元素
• 未处理网格刷新（分页、排序、编辑）后的行渲染逻辑

可行解决方案 #

1. 编写通用处理函数

在页面的Function and Global Variable Declaration中添加以下函数，用于遍历所有行并根据列值切换选择框状态：

function toggleRowSelectors() {
    // 获取交互式网格的grid视图实例
    const igGrid = apex.region("stock_ig_grid_vc_cur").widget().interactiveGrid("getViews", "grid");
    // 获取所有行数据记录
    const allRows = igGrid.model.getRecords();

    allRows.forEach(record => {
        // 获取当前行的目标列值（替换为你的实际列名，需与模型中列名一致）
        const targetValue = record.data.Nivel_Reposicion;
        // 获取当前行的DOM元素
        const rowDom = igGrid.getElement(record);
        // 定位该行的选择框
        const selector = rowDom.querySelector(".a-IG-selector");

        if (selector) {
            // 按需求控制显示：仅当列值为"Sobrestock"时显示选择框，否则隐藏
            selector.style.display = targetValue === "Sobrestock" ? "" : "none";
        }
    });
}

2. 网格初始化时触发处理

编辑你的交互式网格区域，在JavaScript Initialization Code中添加以下代码，确保网格渲染完成后自动执行选择框控制逻辑：

function(options) {
    // 监听网格刷新事件（分页、排序、数据更新后触发）
    apex.event.subscribe("apexafterrefresh", function(event, data) {
        if (data.regionId === "stock_ig_grid_vc_cur") {
            toggleRowSelectors();
        }
    });
    // 网格初始化完成后执行一次
    toggleRowSelectors();
    return options;
}

3. 编辑行后实时更新（可选）

如果目标列支持编辑，需创建动态动作确保编辑后选择框状态同步：

• 事件选择：Interactive Grid - Row Updated
• 区域选择：你的交互式网格区域
• 动作选择：执行JavaScript代码
• 代码内容：toggleRowSelectors();

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