Semantic-Org/Semantic-UI · info

onTabLoad has been renamed to onLoad in 2.0. Please adjust y

Error message

onTabLoad has been renamed to onLoad in 2.0. Please adjust your code

What it means

Semantic UI Tab deprecation notice logged at tab.js:167 by fix.callbacks(): if parameters.onTabLoad is present it is renamed to parameters.onLoad, the legacy key is deleted, and this message is logged. Automatic conversion preserves behavior; the notice nudges migration to the 2.x callback name.

Source

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

  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',
    active  : 'active'
  },

  selector    : {
    tabs : '.ui.tab',
    ui   : '.ui'
  }

View on GitHub (pinned to 597843ab84)

Solutions

1. Rename onTabLoad to onLoad in the tab settings object.
2. Delete the deprecated key after migration.
3. Update copy-pasted examples to the new callback names.

Example fix

// before
$('.menu .item').tab({ onTabLoad: function(path, params, evt){ /*...*/ } });
// after
$('.menu .item').tab({ onLoad: function(path, params, evt){ /*...*/ } });

function migrateTabLoad(cfg) {
  if (cfg && cfg.onTabLoad) { console.warn('Rename onTabLoad -> onLoad'); cfg.onLoad = cfg.onTabLoad; delete cfg.onTabLoad; }
  return cfg;
}

function usesModernTabLoadName(cfg) { return !cfg || typeof cfg.onTabLoad === 'undefined'; }

When it happens

Trigger: Initializing tab with the 1.x callback name: $('.menu .item').tab({ onTabLoad: function(){...} }).

Common situations: Copy-paste from 1.x docs; legacy bundled templates that haven't been updated for 2.x.

Related errors

• onTabInit has been renamed to onFirstLoad in 2.0, please adj
• Starting in 2.0 forms now only take a single settings object
• You are using legacy API success callback names
• You attempted to load content without API module
• The method you called is not defined

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