Dynamic Tab Menu

📘

Similar to the Sidebar Navigation Menu, tab menu items can also be loaded dynamically from your website using the GoNative Javascript Bridge. The tab menu items can be loaded on specific pages or subsequent to events such as a user login flow.

A default tab menu can be defined in the app configuration that is then overwritten dynamically as required. Or alternatively, the configuration can be left blank and all tab menus set by the website.

↔

️GoNative JavaScript Bridge

You may modify selection, as well as Tabs configuration as a whole, with Javascript on your website using GoNative Javascript Bridge. To select tabs run the following command:

JavascriptHTML

if (navigator.userAgent.indexOf('gonative') > -1) {
    gonative. tabNavigation.selectTab(1);
}

<a onclick="gonative. tabNavigation.selectTab(1)">Select 2nd Tab</a>

Note: The tabs are 0-indexed, i.e. gonative. tabNavigation.selectTab(1) will select the second tab

To set/change the tabs:

var tabItems = [{
              "icon": "fas fa-cloud", //optional
              "label": "Tab 1",
              "url": "javascript:alert('You selected tab 1')"
          }, {
              "icon": "fas fa-globe", //optional
              "label": "Tab 2",
              "url": "javascript:alert('You selected tab 2')"
          }, {
              "icon": "fas fa-users", //optional
              "label": "Tab 3",
              "url": "javascript:alert('You selected tab 3')"
          }];
gonative. tabNavigation.setTabs({'enabled': true, 'items': tabItems});