jquery - 添加基于值的 CSS/JQuery 条件格式 Oracle Apex 表单

Question

• 甲骨文 = 11G
• 顶点 = 4.2.6

我在 Oracle APex 中有一个非常大的自定义矩阵网格。这会将月份的名称、区域和天数(即 1、2、3)显示为标题。

行向下 350。每个单元格中都有一个任务类型。所以每个员工每天都有一项任务。

这显示在交互式报告中。

我现在需要做的是根据任务类型突出显示特定的单元格。

例如，背景单元格在生病时为红色，在周末为绿色等等。

我可以使用额外的列

for case when "MD_TS_DETAIL"."JOB_TYPE_ID"= 20 then '#b0c4de'
        when "MD_TS_DETAIL"."JOB_TYPE_ID" = 115 then '#000000'
   end text_color_1,

case when "MD_TS_DETAIL"."JOB_TYPE_ID"= 20 then 'blue'
        when "MD_TS_DETAIL"."JOB_TYPE_ID" = 115 then 'red'
   end back_color_1

然后调用列属性。但要做到这一点，我最多需要执行 31 次，而且不是很动态。

或者可以在操作选择器中使用高亮显示，但这同样需要为每个单词和每种颜色使用 1 个过滤器。这又不是一个好的解决方案。

因此可以根据值动态调用 CSS 或 jQuery。

因为我认为这是不可能的

Answer 1

使用 CSS 和 jQuery 的解决方案。正如您提到的，您需要一个客户端解决方案。我更愿意使用动态操作，以便它从客户端获取资源。

请按照以下步骤操作。

1. 创建动态操作(组件 View --> 动态操作 --> 按 + 按钮)。请对动态 Action 的属性进行一些更改。 (事件 - 页面加载，客户端和服务器端条件无条件)。
2. 展开新添加的动态 Action (假设名称为AddClass)，您可以在其下找到两个文件夹/ Action ，True 和False。在 True 操作下添加名为 show 的新操作。
3. 对 True 下添加的操作进行一些更改(选择类型 - JavaScript Expression ，在 JavaScript Expression 中粘贴以下代码。)

$(document).ready(function() {
    $("td:nth-child(6)").each(function() {
        if ($(this).text() === "sick") {
            $(this).parent().children().css({'background-color': 'red'});
        }
        else if($(this).text() === "weekend"){
            $(this).parent().children().css({'background-color': 'green'});
        }
    });
});

注意:

1. 这表示 td:nth-child(6) Sick/Weekend 数据在 column 6 中可用呈现的表格。 (如果第 3 列有数据，则将数字 6 更改为 3)

2. 上面的代码将突出显示整行，如果您需要只更新特定列，请使用下面的代码。

   <

$(document).ready(function() {
    $("td:nth-child(6)").each(function() {
        if ($(this).text() === "sick") {
            $(this).css({'background-color': 'red'});
        }
        else if($(this).text() === "weekend"){
            $(this).css({'background-color': 'green'});
        }
    });
});