You don't need to call the javascript, when you use the data-toggle
attributes. And if you do want to use javascript, just call it once on ''#myTab
a', as it does the same for each link..
Documentation is here:
http://twitter.github.com/bootstrap/javascript.html#tabs

See: http://jsbin.com/oxukok/1/edit (with data-attributes) or
http://jsbin.com/oxukok/2/edit (with javascript)

(Don't forget to include the javascript plugins!)


On Sat, Aug 25, 2012 at 5:51 PM, SP1966 <[email protected]> wrote:

> Alec, here's what you need to do:
>
>
> <div class="span9">
> <h4>Add New Client</h4>
> <div class="tabbable">
>  <ul class="nav nav-tabs" id="myTab">
>   <li class="active"><a href="#address" data-toggle="tab">Address</a></li>
>   <li><a href="#contact" data-toggle="tab">Contact Information</a></li>
>   <li><a href="#settings" data-toggle="tab">Settings</a></li>
>  </ul>
>
> <div class="tab-content">
>   <div class="tab-pane active" id="address">Pizza</div>
>   <div class="tab-pane" id="contact">Steak</div>
>   <div class="tab-pane" id="settings">Cheeseburger</div>
>  </div>
> </div>
>
>
> <script>
> $('#myTab a[href=#address]').click(function (e) {
>     e.preventDefault();
> $(this).tab('show');
> })
> </script>
> <script>
>  $('#myTab a[href=#contact]').click(function (e) {
>     e.preventDefault();
> $(this).tab('show');
>  })
> </script>
> <script>
> $('#myTab a[href=#settings]').click(function (e) {
>     e.preventDefault();
> $(this).tab('show');
> })
> </script>
>
> </div>
>

Reply via email to