图表制作FineReport单元格间联动

图表制作FineReport单元格间联动

1. 问题描述

在查看报表时，可能某列的数据比较重要或者内容比较多的情况下，希望点击该行的某个数据时让其详细信息单独显示在数据的下方，并且不希望查数据库，此时要如何处理呢？

如上图，我们点击订单号，下面的收货人地址显示对应订单号的货主城市+货主地址。

2. 实现思路

通过给单元格增加超级链接-JavaScript，在js中给下面对应的单元格赋值。

3. 示例

下面我们以一个例子为例来看下如何实现效果。

3.1 打开模板

打开模板： %FR_HOME%\WebReport\WEB-INF\reportlets\doc\Primary\DetailReport\Details_1.cpt

3.2 增加数据列

如上图所示将货主地址拖入到H2单元格中，然后点击 高级>自定义显示将其修改为： 货主城市+$$$即让其显示为"货主城市+货主地区"，最后将该单元格的列宽设置为0。

注："货主城市+$$$"中的货主城市是数据列。

3.3 固定单元格设置

由于要给单元格赋值并且在扩展数据的下方，因此若要在固定位置显示值就要做如下几个设置。

• 每页显示固定条数

我们要让每一页固定显示的条数相同，因此要给单元格增加行后分页的条件属性。

给A2单元格增加行后分页的条件属性，公式条件类型选择公式，并在公式中输入： (row()-1)%10 == 0 即每页显示10条扩展出的数据。

• 重复标题行和结尾行设置

重复标题行：右击行序号1，选择 设置重复标题行。

重复结尾行：选中3、4行，右击选择 设置重复结尾行。

最终的表样如下：

3.4 超级链接设置

下面我们要做的就是给A2单元格设置超级链接，使点击A2单元格时，对应的隐藏的H2单元格的内容显示在B4单元格中。

右击A2单元格，选择超级链接，点击JavaScript，具体设置如下图：

1. var display=$("[id^='B13-0']");   //获取BS端的B13单元格  
2. display.text(address);   //给B13单元格赋值  

注：这边是给BS端对应的单元格赋值，由于A2单元格是扩展的并且固定显示10行数据，因此在模板中的B4单元格在BS端就是B13单元格了。

3.5 分页预览

点击分页预览， 点击对应的订单ID可以看到下面的显示的是对应的详细收货人地址，如上效果图。

已完成的模板可参考： %FR_HOME%\WebReport\WEB-INF\reportlets\doc\SpecialSubject\HyplinkReport\CellsRelate.cpt。

欲了解更多中式java报表软件？请点击