I'm working on a small one page app written using jQuery and Bootstrap to display data from ajax requests into tables in the 'content' of each tab.
Currently the tabbed structure on the page is hard coded in html
<div class="tabbable"> <ul class="nav nav-tabs"> <li class="active"><a href="#tab1" data-toggle="tab">Tab One</a></li> <li><a href="#tab2" data-toggle="tab">Tab Two</a></li> etc </ul>
<div class="tab-content"> <div class="tab-pane active" id="tab1"> table view of data... </div> </div>
I'd like to introduce a templating library such as Mustashe or Handlebars.js, but I'm not sure how to tackle it.
I think I need the templates to iterate over defined 'tabs', providing a slightly different 'content' view for each tab... which can then be populated by my data... How should I best go about this, any help would be gratefully received?