JS Automatically Switch between Tabs

1.1 Requirement

If there is a dashboard with multiple Tab pages, how to automatically switch between these Tab pages?

1.2 Solution

Method 1: The Tab layout provides the tablayout object with the function of automatic rotation of Tab pages, which can be directly set in the [Attributes], as shown in the figure below:

Method 2: Add an After Initialization event through JavaScript to enable the jumping from one Tab page to the next Tab page at regular intervals, so that these Tab pages will be automatically rotated.

2.1 Settings of a JS event

Click [Widget Setting], select [body] in the drop-down list, and add an After Initialization event in the right pane, as shown in the figure below:

Input the following JS codes:

setInterval(function() {
    var aa = _g().getWidgetByName("tabpane0").getShowIndex();
    if(aa == 3) {
        _g().getWidgetByName('tabpane0').showCardByIndex(0);
        //If the 4th Tab block is currently displayed, jump to the 1st Tab block
    } else {
        _g().getWidgetByName('tabpane0').showCardByIndex(aa + 1);
        //If the 1st-3rd Tab blocks are currently displayed, jump to the next Tab block correspondingly
    }
}, 2000);

Note

tabpane0 represents the name of the Tab block; and index() represents the title index.

2.2 Preview

Automatically Switch between Tabs.frm