页面树结构
转至元数据结尾
转至元数据起始

示例说明 

在项目中有时需要对报表显示的内容进行切换显示,如下示例中,报表初始化时显示“明细报表”;点击“显示汇总”则隐藏“明细报表”,显示“汇总报表”;点击“显示明细”则隐藏“汇总报表”,显示“明细报表”。

  • 报表初始化时显示“明细报表”,如下图:

    

  • 点击“显示汇总”则隐藏“明细报表”,显示“汇总报表”,如下图:     

    

  • 点击“显示明细”则隐藏“汇总报表”,显示“明细报表”如下图:    


设置方法

  1. 在电子表格设计器 Excel 中,创建一张电子表格报表。
  2. 在浏览器的资源定制节点下,选中电子表格,右键选择 编辑宏 进入报表宏界面
  3. 在报表宏界面新建服务器端模块,在弹出的新建模块对话框中选择对象为spreadsheetReport;事件为onBeforeOutput;并把下面的服务器宏代码复制到代码区域。
  4. 在报表宏界面新建客户端模块,在弹出的新建模块对话框中选择对象为spreadsheetReport;事件为onRender;并把下面的客户端宏代码复制到代码区域。

服务器宏类型

类型

对象

事件

ServerSide

spreadsheetReport

onBeforeOutput

服务器宏代码

function main(spreadsheetReport) {
    spreadsheetReport.printExpandedPositions(); //打印扩展位置,使得客户端宏可以调用getExpandedPositions方法
}


客户端宏类型

类型

对象

事件

ClientSide

spreadsheetReport

onRender

客户端宏代码

function main(spreadsheetReport) {
    var detail = false;
    var cell = spreadsheetReport.getCell("A2"); //点击的单元格
    cell.style.cursor = "pointer"; //鼠标变手
    var A3List = spreadsheetReport.getExpandedPositions("A3"); //获取A3的位置
    var A3First = spreadsheetReport.parseCellIndex(A3List[0]); //获取A3第一个
    var A3Row = spreadsheetReport.getCell(A3First[0], A3First[1]).parentNode; //获取A3所在的TR
    var A7List = spreadsheetReport.getExpandedPositions("A7"); //获取所有A7的位置
    var A7Last = spreadsheetReport.parseCellIndex(A7List[A7List.length - 1]); //A7最后一个
    var A7Row = spreadsheetReport.getCell(A7Last[0], A7Last[1]).parentNode; //获取A7所在的TR
    var A8List = spreadsheetReport.getExpandedPositions("A8"); //获取A8的位置
    var A8First = spreadsheetReport.parseCellIndex(A8List[0]); //获取A8第一个
    var A8Row = spreadsheetReport.getCell(A8First[0], A8First[1]).parentNode; //获取A8所在的TR
    var A10List = spreadsheetReport.getExpandedPositions("A10"); //获取所有A10的位置
    var A10Last = spreadsheetReport.parseCellIndex(A10List[A10List.length - 1]); //A10最后一个
    var A10Row = spreadsheetReport.getCell(A10Last[0], A10Last[1]).parentNode; //获取A3所在的TR
 
    cell.onclick = function() {
        if (detail) {
            var tr = A3Row;
            //循环显示从A3-A7的所有行
            while (tr && tr != A7Row) {
                tr.style.display = "";
                tr = tr.nextSibling;
            }
            A7Row.style.display = "";
            var tr = A8Row;
            //循环隐藏从A8-A10的所有行
            while (tr && tr != A10Row) {
                tr.style.display = "none";
                tr = tr.nextSibling;
            }
            A10Row.style.display = "none";
            cell.innerText = "显示明细";
            detail = false;
        } else {
            var tr = A3Row;
            //循环隐藏从A3-A7的所有行
            while (tr && tr != A7Row) {
                tr.style.display = "none";
                tr = tr.nextSibling;
            }
            A7Row.style.display = "none";
            var tr = A8Row;
            //循环显示从A8-A10的所有行
            while (tr && tr != A10Row) {
                tr.style.display = "";
                tr = tr.nextSibling;
            }
            A10Row.style.display = "";
            cell.innerText = "显示汇总";
            detail = true;
        }
    }
    cell.onclick();
}
  • 无标签