无法再通过 jQuery 选择模式对话框中的交互式网格

编程问答 2022-04-25

问题描述

背景信息：

我们的情况

在工作中，我们创建了多个应用程序，其中一些使用模态对话框页面内的交互式网格。上周我们从 Oracle APEX 19.1 升级到 Oracle APEX 21.1。
下面描述的问题在 19.1 版本中不存在。
（如果重要：我们必须在 Windows 上支持 Google Chrome）

如何导航到 IG

在我们所有的情况下，都可以通过以下方式访问交互式网格：

  • 导航到第 x 页
  • 打开模态对话框 y
  • 从模态对话框 y 打开模态对话框 z（通过页面处理后的分支）
    => 交互式网格可以在模态对话框 z 中找到

目标和准备

我们只想让用户访问一些交互式网格功能。 出于这个原因，我们给每个 IG 一个静态 ID。

什么仍然有效

模态对话框打开，交互网格正常显示。

我们的问题

在升级之前，以下代码段删除了相应 IG 的一些功能：

$(window).on("load",function() {
    var actions = apex.region("example_ig_id").widget().interactiveGrid("getActions");
    actions.remove("selection-copy-down");
    actions.remove("selection-fill");
    actions.remove("selection-clear");
    actions.remove("single-row-view");
    actions.remove("selection-copy");
});

但自从升级到 21.1 版后，apex.region("example_ig_id") 返回 null。也无法通过 $("#example_ig_id") 找到 dom 元素。

我们发现并尝试了什么

在 google chrome 开发者工具中，id 为 example_ig_id 的 div 在元素下可见。 加载页面后，然后单击 div 的 class 属性（通过开发人员工具）对其进行编辑（无需真正编辑任何内容）并取消它，apex.region("example_ig_id") 不再返回 null。如果我编辑其直接或间接父元素（也使用包含 IG 的模态对话框的 iframe 进行测试），这也适用。

自从发现这一点以来，我试图解决强制刷新或回流的问题。 我测试了此处给出的多个答案：Force DOM redraw/refresh on Chrome/Mac
我尝试的测试（在内联控制台中）都没有解决我的问题：

$("iframe").each(function(){$(this).addClass("testClass"); $(this).removeClass("testClass");});

和：

$("iframe").each(function(){$(this).hide(); $(this).show(0);});

和：

$("iframe").each(function () {
    $(this).css("opacity",.99);
    setTimeout(function () {
        $(this).css("opacity",1);
    },20);
});

我使用了模态对话框本身的 iframe，因为它从一开始就可以选择。

我不确定我是否犯了错误，但非常感谢您的帮助。

解决方法

此时我得到了帮助，问题解决了。

而不是定义这个'

$(window).on("load",function() {
    var actions = apex.region("example_ig_id").widget().interactiveGrid("getActions");
    actions.remove("selection-copy-down");
    actions.remove("selection-fill");
    actions.remove("selection-clear");
    actions.remove("single-row-view");
    actions.remove("selection-copy");
});

页面里面

函数和全局变量声明

只粘贴函数内容

var actions = apex.region("P7_SAVED_JOBS_IG").widget().interactiveGrid("getActions");
actions.remove("selection-copy-down");
actions.remove("selection-fill");
actions.remove("selection-clear");
actions.remove("single-row-view");
actions.remove("selection-copy");

进入页面下

页面加载时执行

成功了。

我不知道是事件处理程序的执行时间太早还是与 iframe 及其上下文有关。

interactive-gridjavascriptjquerymodal-dialogoracle-apex