Semantic-Org/Semantic-UI · info
onTabLoad has been renamed to onLoad in 2.0. Please adjust…
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.
Solutions
- Rename onTabLoad to onLoad in the tab settings object.
- Delete the deprecated key after migration.
- 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){ /*...*/ } }); Defensive patterns
Strategy: validation
Validate before calling
function migrateTabLoad(cfg) {
if (cfg && cfg.onTabLoad) { console.warn('Rename onTabLoad -> onLoad'); cfg.onLoad = cfg.onTabLoad; delete cfg.onTabLoad; }
return cfg;
} Type guard
function usesModernTabLoadName(cfg) { return !cfg || typeof cfg.onTabLoad === 'undefined'; } Prevention
- Search the codebase for 'onTabLoad' during Semantic UI upgrades.
- Use the 2.x callback names in new code.
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…
- Starting in 2.0 forms now only take a single settings…
- Activated tab cannot be found. Tabs are case-sensitive.
- History enabled, but no path was specified
- History requires Asual's Address library…
AI-assisted analysis of Semantic-Org/Semantic-UI@597843ab84 (2026-08-13).
Data as JSON: /api/errors/0c7cae5c57438913.
Report an issue: GitHub.
Appendix: 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)