Semantic-Org/Semantic-UI · error

You attempted to load content without API module

Error message

You attempted to load content without API module

What it means

Semantic UI Tab error logged at tab.js:533 when remote tab loading is requested but $.api is undefined. Tab relies on the separate Semantic UI API module to fetch remote content; if api.js is not loaded, it cannot satisfy a tab path that requires AJAX and logs this error.

Source

Thrown at src/definitions/modules/tab.js:923

  cache           : true,       // cache the content requests to pull locally
  loadOnce        : false,      // Whether tab data should only be loaded once when using remote content
  cacheType       : 'response', // Whether to cache exact response, or to html cache contents after scripts execute
  ignoreFirstLoad : false,      // don't load remote content on first load

  apiSettings     : false,      // settings for api call
  evaluateScripts : 'once',     // whether inline scripts should be parsed (true/false/once). Once will not re-evaluate on cached content

  onFirstLoad : function(tabPath, parameterArray, historyEvent) {}, // called first time loaded
  onLoad      : function(tabPath, parameterArray, historyEvent) {}, // called on every load
  onVisible   : function(tabPath, parameterArray, historyEvent) {}, // called every time tab visible
  onRequest   : function(tabPath, parameterArray, historyEvent) {}, // called ever time a tab beings loading remote content

  templates : {
    determineTitle: function(tabArray) {} // returns page title for path
  },

  error: {
    api        : 'You attempted to load content without API module',
    method     : 'The method you called is not defined',
    missingTab : 'Activated tab cannot be found. Tabs are case-sensitive.',
    noContent  : 'The tab you specified is missing a content url.',
    path       : 'History enabled, but no path was specified',
    recursion  : 'Max recursive depth reached',
    legacyInit : 'onTabInit has been renamed to onFirstLoad in 2.0, please adjust your code.',
    legacyLoad : 'onTabLoad has been renamed to onLoad in 2.0. Please adjust your code',
    state      : 'History requires Asual\'s Address library <https://github.com/asual/jquery-address>'
  },

  metadata : {
    tab    : 'tab',
    loaded : 'loaded',
    promise: 'promise'
  },

  className   : {
    loading : 'loading',

View on GitHub (pinned to 597843ab84)

Solutions

1. Include the Semantic UI API module (semantic-api.js or the full build) before the tab module.
2. Ensure the tab has a matching in-DOM target so it does not fall into the remote-load branch.
3. Set the tab's content path explicitly and confirm apiSettings is configured if remote loading is intended.

Example fix

// before - missing api module
<script src="semantic-tab.js"></script>
// after
<script src="semantic-api.js"></script>
<script src="semantic-tab.js"></script>

if (typeof $.api === 'undefined' && hasRemoteTabs()) {
  console.error('Include semantic-api.js before enabling remote tabs');
} else {
  $('.menu .item').tab({ apiSettings: { url: '/tabs/{tab}.html' } });
}

function isApiModuleLoaded() { return typeof $.api === 'function'; }

When it happens

Trigger: Declaring a tab with a remote path (data-tab="remote/path") and a corresponding API setting, or relying on settings.apiSettings, while the Semantic UI API javascript file is not included in the page.

Common situations: Custom bundle of Semantic UI that omits the api module; upgrading and forgetting to include api.js; using a CDN that splits modules and missing one; tab paths that look local but the DOM has no matching tab so the loader falls through to the remote branch.

Related errors

• The before send function has aborted the request
• There was an error with your request
• API Request Aborted. Exit conditions met
• JSON could not be parsed during error handling
• You are using legacy API success callback names

AI-assisted analysis of Semantic-Org/Semantic-UI@597843ab84 (2026-08-13). Data as JSON: /api/errors/8b671f47c25a0f5b. Report an issue: GitHub.