Skip to content


Subversion checkout URL

You can clone with
Download ZIP


Tabs doesn't work #1709

dhydrated opened this Issue · 15 comments

8 participants


Ive tried using the new tabs but I cant switch to next tab. Seems like the javascript doesnt fire.


Can you post a jsfiddle of the problem so we can see what you/ve got?


I had the same problem, using jquery-1.6.1.
After upgrade to jquery-1.7.1 works perfect.
So use jquery-1.7.1.


Yea, as it says on the docs, Bootstrap requires the latest version of jQuery.

The plugins use the new .on() event binding function, which was introduced in jQuery 1.7.


Here the jsfiddle sample. I'm using jquery 1.7.1 and it still doesn't work for me. What did I do wrong?


You need to update and css classes.
See them in


Looks like the code example on the JS docs page for tabs is outdated. Use the code example here for reference:


@cgunther Was having the same problem, thanks a lot, the code you referenced work for me!


In updated sample below, I only managed to get the Tab UI to be rendered. But I still cant switch between tabs.

Another thing is, the active tab wont be shown by default if I used the Tab javascript. It will show if I commented out the tab() call.


@dhydrated Have you tried changing your markup to what is shown in the docs here:

Example, yours would look like:


Am having same problem, will post some code later.


@dhydrated In this example you are missing data-toggle="tab" on each tab - here is an updated fiddle with this working: you also DO NOT need the JS to use the tabs, Bootstrap will set up the tabs based on the data* tags so you dont need $('#tabs').tab('show');


@dhydrated here is an example of using the tab(show) You need an addiitional ID on the A tag for the tab you want to show at runtime/when the .tab('show') is run.

No problems found in Bootstrap. Mainly a documentation/User knowledge issue.


I have added more documentation and added to this pull request: #1753


So Im wondering what does $().tab('show') actually do? Bcoz Im trying to avoid having all those bootstrap attributes if possible. In previous version Im able to render the Tab solely by bootstrap javascript. So in version 2 the only way to get the Tab working is via data-toggle markup.

@dhydrated dhydrated closed this

Ummmm yeah, that threw me for a loop. Phil's example above works. WATCH the data-toggle="tab" added to the HREF.
Thank you scripty brothas !!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.