I. Overview
1.1 Requirement
When using the Tab block function for forms, we will encounter the following problem:
If there are multiple Tab pages in a Tab block and we are not on the first Tab page, then by clicking Query to refresh the report, it will jump to the first Tab page by default, as shown in the figure below:
The goal is to achieve: by clicking Query, the report will stay on the current Tab page, rather than jump to the first Tab page, as shown in the figure below:
1.2 Solution
Set JavaScript in the Tab block: record the current Tab page through a Tab To Switch Event, so that the recorded Tab page will be displayed after clicking Query.
II. Sample
2.1 Add a query widget
Add a [Parameter Pane] to the template and add a [Query] widget, as shown in the figure below:
2.2 Add a Tab To Switch Event
Select the Tab block widget, choose [tabpane0] below the selected Tab block in the widget list and add a [Tab To Switch Event], as shown in the figure below:
Input the following JS codes:
setTimeout(function(){
//After Tab switch, get the index of the current Tab block
window.IndexNum=_g().getWidgetByName("tabpane0").getShowIndex();
},50);
2.3 Add an After Initialization event
Select the Tab block widget, choose [tabpane0] below the selected Tab block in the widget list and add an [After Initialization] event, as shown in the figure below:
Input the following JS codes:
this.options.form.getWidgetByName("tabpane0").showCardByIndex(window.IndexNum);
2.4 Preview
Save the template and click [Form Preview]. The effect is shown below:
