I. Description
When viewing the report, if the data in a certain column is more important or there are more content, you want to click on a certain data in the row to have its detailed information displayed separately below the data, and you don’t want to check the database. What should I do at this time? How to deal with it?
As shown in the figure above, we click on the order number, and the Employee below displays the EMPID corresponding to the OrderID.
II. Idea
By adding a hyperlink-JavaScript to the cell, assign a value to the corresponding cell below in JS.
III. Example
Let's take an example as an example to see how to achieve the effect.
1. Open the template
Open the template: %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc-EN\Primary\DetailReport\Change_Display_Value.cpt
2. Set data column
Drag the EMPID into the H2 cell as shown in the figure above, and then click Advanced>Display Value to modify it to: "Employee's id is" + $$$, which means it will be displayed as "Employee's id is+EMPID", and finally The column width of the cell is set to 0.
3. Fixed cell settings
Since you need to assign a value to the cell and below the extended data, you need to do the following settings if you want to display the value in a fixed position.
1) Display a fixed number of bars per page
We want to make each page fixedly display the same number of bars, so we need to add the conditional attribute of page break after row to the cell.
Add the condition attribute of the page after adding a row to cell A2, select the formulatype, and enter in the formula: (row()-1)%10 == 0, which means that 10 pieces of expanded data are displayed on each page.
2) Repeat title rows and duplicate end rows settings
Repeat title rows: Right-click the row number 1, and select Set Repeat Title Rows.
Duplicate end rows: select lines 3 and 4, right-click and select Set Duplicate End Rows.
The final form is as follows:
4. Hyperlink setting
The next thing we need to do is to set a hyperlink to cell A2 so that when cell A2 is clicked, the content of the corresponding hidden H2 cell is displayed in cell B4.
Right-click cell A2, select the hyperlink, click JavaScript, and the specific settings are as follows:
var display=$("[id^='B13-0']");
display.text(EMP);
Note: here is to assign values to the corresponding cells on the B/S side. Since cell A2 is expanded and displays 10 rows of data, cell B4 in the template is cell B13 on the B/S side.
5. Pagination preview
Click pagination preview, click the corresponding Order ID, you can see the corresponding EMPID is displayed below, as shown in the above rendering.
IV. Template download
The completed template can refer to: %FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc-EN\ReportApplication\FeaturesApplication\Cell_Linkage.cpt
Click to download: