如何在Oracle Apex交互式网格中设置选中行为只读并解锁？

方案一：前端临时控制（页面刷新后失效） #

适合仅需临时禁用编辑的场景，无需修改数据库。

步骤： #

1. 在页面创建两个按钮（或单个切换按钮）：

   • 按钮1：设为只读，类型为"按钮"，位置放在交互式网格上方/下方。
   • 按钮2：恢复编辑，同上。

2. 给"设为只读"按钮添加动态动作：

   • 触发条件：点击
   • 动作：执行JavaScript代码，代码如下：

     // 替换为你的交互式网格静态ID
     const igStaticId = "YOUR_IG_STATIC_ID";
     const ig = apex.region(igStaticId).widget().interactiveGrid("getViews", "grid");
     const selectedRows = ig.getSelectedRecords();
     
     selectedRows.forEach(row => {
         // 标记行只读状态
         row.metadata.readOnly = true;
         // 禁用该行所有可编辑单元格
         ig.setCellEditable(row, null, false);
     });
     // 刷新网格视图生效
     ig.refresh();
     

3. 给"恢复编辑"按钮添加动态动作：

   • 触发条件：点击
   • 动作：执行JavaScript代码，代码如下：

     const igStaticId = "YOUR_IG_STATIC_ID";
     const ig = apex.region(igStaticId).widget().interactiveGrid("getViews", "grid");
     const selectedRows = ig.getSelectedRecords();
     
     selectedRows.forEach(row => {
         delete row.metadata.readOnly;
         // 恢复该行所有单元格编辑权限
         ig.setCellEditable(row, null, true);
     });
     ig.refresh();
     

注意： #

• 必须替换YOUR_IG_STATIC_ID为你实际的交互式网格静态ID（在网格属性中查看）。
• 此方案仅在当前页面会话生效，刷新页面后会回到初始可编辑状态。

方案二：持久化控制（刷新后保持状态） #

需要配合数据库字段存储只读状态，适合需要长期保存禁用状态的场景。

步骤： #

1. 修改数据表：新增一个字段IS_READONLY，类型VARCHAR2(1)，默认值'N'，用于标记行是否只读。

2. 配置交互式网格：

   • 将IS_READONLY字段添加到网格中，设置为隐藏（不需要用户可见）。
   • 确保网格的允许选择行已开启，且主键字段已包含在网格中（即使隐藏）。

3. "设为只读"按钮配置：

   • 添加动态动作，触发条件为点击，包含两个动作：

     1. 执行PL/SQL代码（更新数据库状态）：

        -- 替换YOUR_TABLE为实际表名，ID为主键字段
        UPDATE YOUR_TABLE
        SET IS_READONLY = 'Y'
        WHERE ID IN (SELECT column_value FROM apex_string.split(:APEX$ROW_SELECTOR, ','));
        COMMIT;
        

        注：:APEX$ROW_SELECTOR是Apex内置变量，存储选中行的主键值集合，需确保网格已配置主键。

     2. 执行JavaScript代码（前端禁用编辑）：

        const igStaticId = "YOUR_IG_STATIC_ID";
        const ig = apex.region(igStaticId).widget().interactiveGrid("getViews", "grid");
        const selectedRows = ig.getSelectedRecords();
        
        selectedRows.forEach(row => {
            row.IS_READONLY = 'Y';
            ig.setCellEditable(row, null, false);
        });
        ig.refresh();
        

4. "恢复编辑"按钮配置：

   • 添加动态动作，触发条件为点击，包含两个动作：
     1. 执行PL/SQL代码（更新数据库状态）：

        UPDATE YOUR_TABLE
        SET IS_READONLY = 'N'
        WHERE ID IN (SELECT column_value FROM apex_string.split(:APEX$ROW_SELECTOR, ','));
        COMMIT;
        

     2. 执行JavaScript代码（前端恢复编辑）：

        const igStaticId = "YOUR_IG_STATIC_ID";
        const ig = apex.region(igStaticId).widget().interactiveGrid("getViews", "grid");
        const selectedRows = ig.getSelectedRecords();
        
        selectedRows.forEach(row => {
            row.IS_READONLY = 'N';
            ig.setCellEditable(row, null, true);
        });
        ig.refresh();
        

5. 网格初始化时自动应用只读状态：

   • 给交互式网格添加行初始化动态动作：
     • 触发条件：行初始化
     • 动作：执行JavaScript代码：

       const igStaticId = "YOUR_IG_STATIC_ID";
       const ig = apex.region(igStaticId).widget().interactiveGrid("getViews", "grid");
       const row = this.data;
       
       if (row.IS_READONLY === 'Y') {
           ig.setCellEditable(row, null, false);
       }
       

   这样页面刷新或数据加载时，已标记为只读的行会自动禁用编辑。

注意： #

• 确保交互式网格的"行选择器"已启用，:APEX$ROW_SELECTOR才能正确获取选中行主键。
• 如果使用单个按钮切换状态，可以在JS中判断选中行的IS_READONLY值，动态执行更新和禁用/恢复逻辑。

内容的提问来源于stack exchange，提问作者Oracle Apex Developer