包含相同产品名称的颜色报告行

时间:2013-04-27 20:29:34

标签: oracle-apex

我有一个产品列表,我试图在每个产品之间交替颜色(灰色,白色,灰色,白色等)。我了解如何根据以下链接使用颜色格式:example followed。但是,我不知道如何让它查看报告中的上一行并检查它是否包含相同的产品名称。如果是,则将行着色为相同颜色,否则为备用颜色 我在应用程序中设置了一个示例报告:Application 67666 - Color Row by Product示例。我在报告中有两个产品,所以我试图获得3条灰线,然后是3条白线,如果我有更多的产品,那么它会回到灰色等等。

链接:apex.oracle.com

workspace:apps2

user:user

密码:DynamicAction2

请问我是否可以指向正确的方向,JavaScript和动态操作会像我在示例链接中那样向我发出警告,但它看着上一行让我陷入困境。

1 个答案:

答案 0 :(得分:0)

我真的想不到另一个解决方案而不是javascript。可能使用lag in the sql,但仅用于确定行颜色应该更改的位置。您可以在列的html表达式中使用列的值并将其放在类中,但仍然需要使用javascript迭代它。因此,使用javascript似乎不那么繁琐。

内联CSS:

table.report-standard tr.normalRow td{
background-color: green;
}
table.report-standard tr.altRow td{
background-color: red;
}

这将覆盖默认样式,但您需要根据需要对其进行调整。例如,颜色更改:行的悬停。我更喜欢通过分配类来指导样式,然后在css中定义规则,而不是通过javascript直接分配css(将它放在样式标记中,呃)。

  • 动态操作:更改行颜色
  • 刷新后,区域,产品报告
  • 真实行动:执行javascript代码,在页面加载检查时触发

    $('td[headers="PRODUCT"]', this.triggeringElement).each(function(){
    var lCurrRow = $(this).closest('tr'),
        lPrevRow = lCurrRow.prev(), 
        lPrevVal = lPrevRow.find('td[headers="PRODUCT"]').text();
    console.log(lPrevVal + ' - ' + $(this).text());
    //if value on previous row differs from the that on the current row
    //then change the class
    //if the value didnt change, then use the same class as the previous row
    if ( lPrevVal != $(this).text() ){
      if ( lPrevRow.hasClass('normalRow') ){
        lCurrRow.addClass('altRow');
      } else {
        lCurrRow.addClass('normalRow');
      };
    } else {
      if ( lPrevRow.hasClass('normalRow') ){
        lCurrRow.addClass('normalRow');
      } else {
        lCurrRow.addClass('altRow');
      };
    };
    })
    

在apex.oracle.com上检查你的解决方案,我在那里实现了它。