Bootstrap Tabs Dynamic¶ ↑

A framework for adding, remove, renaming and in general handling Twitter Bootstrap Tabs through JavaScript.

Examples¶ ↑

@nick322 has set up this exelent JS Fiddle: jsfiddle.net/0ua2gzyc/

Usage¶ ↑

Require the single JavaScript file.

Adding a new tab¶ ↑

tabs = $("ul.nav-tabs")
tabs.addBSTab("id_of_tab", "Tab title", "<b>Content</b>")

You can also add it by an element already defined (maybe as hidden?):

tabs.addBSTab("id_of_tab", "Tab title", $("#my_element_id"))

Removing a tab¶ ↑

tab = tabs.getBSTabByID("id_of_tab")
tab.removeBSTab()

Renaming a tab¶ ↑

tab = tabs.getBSTabByID("id_of_tab")
tab.renameBSTab("New title")

Getting the tab from a subelement within the tab.¶ ↑

a.click(function(){
  tab = $(this).currentBSTab()
})

Getting the tab ID from a subelement within the tab.¶ ↑

a.click(function(){
  tab_id = $(this).currentBSTabID()
})