Topic: JS to open a tab not working

launchbrigade priority asked 2 years ago


Expected behavior I use this code :

const triggerEl = document.querySelector('#in-the-news');
mdb.Tab.getInstance(triggerEl).show(); // Select tab by name

to open a tab

Actual behavior

Console Log Error

Uncaught TypeError: Cannot read properties of null (reading 'show')

Resources (screenshots, code snippets etc.)

if i add

console.log(triggerEl)

i get

(index):962 div#in-the-news.tab-pane.fade

maksam07 free answered 6 months ago


After all this time, I am still having problems with getInstance. I found another solution.

new mdb.Tab(document.getElementById('in-the-news')).show()

Dawid Wajszczuk staff answered 2 years ago


Hi,

Here is the snippet https://mdbootstrap.com/snippets/standard/d-wajszczuk/3561424#js-tab-view. Everything works fine. You probably use wrong selector or maybe your tabs are hidden during the page load and they need to be initialized manually.

Keep coding,
Dawid



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 3.9.0
  • Device: All
  • Browser: Chrome
  • OS: Mac 11.1
  • Provided sample code: No
  • Provided link: No