Tab control API

Open, navigate, focus, and list controlled tabs.
Docs updated: 2025-12-17

openTab

openTab creates a controlled tab (or reuses an existing one) and associates it with your tabKey.

// Open (or reuse) a controlled tab
await RTOForm.openTab(
  {
    tabKey: "billing",
    url: "https://example.com/billing",
    focus: true,     // bring to front (default true)
    newTab: true,    // create a tab if needed (default true)// reuse existing tabKey if already open (default true)
  },
  { timeoutMs: 20000 }
);

focusTab / closeTab

// Focus a tab
await RTOForm.focusTab("billing");          // shorthand
await RTOForm.focusTab({ tabKey:"billing" });

// Close a tab
await RTOForm.closeTab("billing");

listTabs

Useful for dashboards and UI lists. If you want a normalized response shape, use RTO_tabsList.js.

// List controlled tabs (raw)
const res = await RTOForm.listTabs({}, { timeoutMs: 4000 });
console.log(res);

// Easier: use RTOTabsList (normalizes the response)
<script src="../RTO_helpers/RTO_tabsList.js"></script>
<script>
  RTOTabsList.requestNow().then(function(snapshot){
    console.log("items:", snapshot.items);
    console.log("byKey:", snapshot.byKey);
  });
</script>

UI helpers

If you do not want to write click handlers, RTO_openTab_button.js can bind buttons with data-attributes.

<!-- Button that opens (or focuses) a tab -->
<button
  data-rto-url="https://example.com/billing"
  data-rto-tabKey="billing"
  data-rto-mode="open"
>
  Open billing
</button>

<script src="../RTO_helpers/RTO_form_api.js"></script>
  <script src="../RTO_helpers/RTO_DOM_actions.js"></script>
<script src="../RTO_helpers/RTO_openTab_button.js"></script>

Next