twbs/bootstrap · error · TypeError
No method named "${config}"
Error message
No method named "${config}" What it means
Modal's jQueryInterface forwards a second argument to the method — data[config](relatedTarget), which only show and toggle actually accept — and throws when the method string is not an instance property. Public methods are toggle, show, hide, handleUpdate and dispose. The Bootstrap vocabulary is show/hide, not the open/close used by jQuery UI.
Source
Thrown at js/src/modal.js:327
}
}
_resetAdjustments() {
this._element.style.paddingLeft = ''
this._element.style.paddingRight = ''
}
// Static
static jQueryInterface(config, relatedTarget) {
return this.each(function () {
const data = Modal.getOrCreateInstance(this, config)
if (typeof config !== 'string') {
return
}
if (typeof data[config] === 'undefined') {
throw new TypeError(`No method named "${config}"`)
}
data[config](relatedTarget)
})
}
}
/**
* Data API implementation
*/
EventHandler.on(document, EVENT_CLICK_DATA_API, SELECTOR_DATA_TOGGLE, function (event) {
const target = SelectorEngine.getElementFromSelector(this)
if (['A', 'AREA'].includes(this.tagName)) {
event.preventDefault()
}
View on GitHub (pinned to 6177d5f849)
Solutions
- Use show, hide, toggle, handleUpdate or dispose.
- To forward a related target (V5.2.4+ show behavior), keep it as the second argument: $('#modal').modal('show', relatedTarget).
- Fix jQuery UI habits: open → show, close → hide.
- For dynamic dispatch, check the method exists on bootstrap.Modal.getInstance(el) first.
Example fix
// before
$('#modal').modal('open', evt.relatedTarget) // TypeError: No method named "open"
// after
$('#modal').modal('show', evt.relatedTarget) // toggle | show | hide | handleUpdate | dispose Defensive patterns
Strategy: validation
Validate before calling
function callModalMethod(element, method, relatedTarget) {
const instance = bootstrap.Modal.getOrCreateInstance(element)
if (typeof instance[method] !== 'function') {
console.warn(`Modal: ignoring unknown method "${method}"`)
return
}
instance[method](relatedTarget) // only show/toggle consume relatedTarget
} Type guard
const MODAL_METHODS = ['toggle', 'show', 'hide', 'handleUpdate', 'dispose'] as const type ModalMethod = (typeof MODAL_METHODS)[number] const isModalMethod = (m: string): m is ModalMethod => (MODAL_METHODS as readonly string[]).includes(m)
Try / catch
try {
$('#modal').modal(method, relatedTarget)
} catch (err) {
if (err instanceof TypeError && err.message.startsWith('No method named')) {
console.warn(`Modal: unknown method "${method}"`)
} else {
throw err
}
} Prevention
- Translate jQuery UI habits: open→show, close→hide.
- Method names are case-sensitive — handleUpdate, not handleupdate.
- Keep relatedTarget as the second jQuery-bridge argument only for show/toggle.
- Whitelist dynamic names against the five public methods.
When it happens
Trigger: $('#modal').modal('open') or modal('close') — jQuery UI vocabulary; $('#modal').modal('handleupdate') (case-sensitive handleUpdate); $('#modal').modal('toggleEnabled') (a Tooltip method, not Modal); $('#modal').modal('getInstance').
Common situations: Developers porting jQuery UI dialog code; copy-paste from older tutorials; mixing method vocabularies between Bootstrap components; passing static helper names through the bridge.
Related errors
- No method named "${config}"
- No method named "${config}"
- No method named "${config}"
- No method named "${config}"
- No method named "${config}"
AI-assisted analysis of twbs/bootstrap@6177d5f849 (2026-08-22).
Data as JSON: /api/errors/c1f3a99d464e23b0.
Report an issue: GitHub.