I. Description
A dashboard contains two iframes A and B, and the two iframes display two different reports respectively. How to click the button in the iframe A to refresh the content in iframe B?
The desired effect is as follows (the left is iframe A while the right is iframe B):
II. Ideas
Use window.parent to get the iframe of the parent template, and use the method reload() of the iframe widget to refresh iframe.
Note: Need to install the plugin iframe Widget.
III. Examples
3.1 Create a parent template
Create a dashboard, and drag in two iframes, as shown in the following figure:
3.2 Create sub-template A
1) Create a normal report A.cpt. Select cell A1, in the property panel on the right, select the button widget, and set the button name to: refresh parent iframe B, as shown in the following figure:
2) Add a Click event:
The JS code is as follows:
window.parent._g().getWidgetByName('rHIframe1').reload(); //rHIframe1 is the name of the iframe that needs to be refreshed in the parent template
Or use the following code:
var parent = window.parent;
var iframe = parent.document.getElementById('RHIFRAME1');//RHIFRAME1 is the capitalization of the name of the iframe that needs to be refreshed in the dashboard
iframe.contentWindow.location.reload(true);
3) Save the sub-template A.cpt.
3.3 Create sub-template B
1) Create a new normal report B.cpt, and insert the formula in cell A1: ROUND5(RAND() * 50,0), as shown in the figure below:
2) Save the sub-template B.cpt.
3.4 Set iframes in the parent template
1) Open the parent template parent.frm, select iframe rHIframe0, set the template path and parameters, select A.cpt as the template path, add a parameter named op, and set the parameter value to a string: write:
2) Select iframe rHIframe1, and set the template path as B.cpt:
3) Save the parent template parent.frm.
IV. Preview the Effect
Save the templates parent.frm, A.cpt and B.cpt in the folder reportlets. Preview parent.frm, and the final effect is as shown at the beginning.
Note: Mobile terminal is not supported.
