隐藏行后隔行变色

编辑
  • 文档创建者:axing
  • 浏览次数:2764次
  • 编辑次数:8次
  • 最近更新:Kevin-s 于 2019-06-20
  • 1. 描述

    如果我们对报表设置了隔行变色,又设置了条件属性来隐藏行高,会使原本的隔行变色看起来很混乱。如下,隐藏了销量小于 400 的行后:

    222


    2. 思路

    当隐藏行的条件成立时,不执行隔行变色的条件,否则就执行。或者利用js实现。


    3. 操作步骤

    3.1 利用条件属性

    上图的设计如下:

    222

    E2 单元格的条件属性隐藏了销量小于 400 的行,如图所示:

    222

    在 A2 单元格处设置条件属性-背景,条件为IF(E2>=400,SEQ()%2==0,FALSE)

    222
    保存预览即可。


    3.2 利用 JS 实现

    1)普通报表

    点击模板>模板 Web 属性>分页预览设置,添加加载结束事件,JS 代码如下:

    $(".x-table tr:visible").each(function(i) {
    if (i % 2 == 0 && i >= 1) {
    $(this).css("background-color", "#b7e5fe");
    }
    });

    注:其中,i>=1 中的 1,指的是设置变色的单元格所在行数 -1。


    222

    2)决策报表

    点击报表块,在右侧面板中点击事件,添加初始化后事件,JS 代码如下:

    setTimeout(function() {
    $(".x-table tr:visible").each(function(i) {
    if (i % 2 == 0 && i >= 1) {
    $(this).css("background-color", "#b7e5fe");
    }
    });
    }, 1000);

    222

    4. 效果预览

    4.1 PC 端效果

    1)普通报表

    222

    2)决策报表
    222


    4.2 移动端效果

    222

    注:H5 与 App 均可实现,效果相同。


    附件列表


    主题: 报表应用
    标签: 暂无标签
    如果您认为本文档还有待完善,请编辑

    文档内容仅供参考,如果你需要获取更多帮助,付费/准付费客户请咨询帆软技术支持
    关于技术问题,您还可以前往帆软社区,点击顶部搜索框旁边的提问按钮
    若您还有其他非技术类问题,可以联系帆软传说哥(qq:1745114201

    此页面有帮助吗?只是浏览 [ 去社区提问 ]