jquery - how to set active class when user clicks on a nav-tabs -


i have following markup inside asp.net mvc web application, display 2 tabs, , using bootstrap 2.0.2:-

 <ul class="nav nav-tabs" id="mytab">       @if(model.hasracks)     {    <li> @ajax.actionlink("show related racks", "customerrack","customer",     new {customerid = model.accountdefinition.org_id},     new ajaxoptions {  insertionmode = insertionmode.replace,  updatetargetid = "detail"  ,  loadingelementid = "progress",   onsuccess="detailsuccess"  } )    </li>  }       @if(model.hasserver)     {     <li >@ajax.actionlink("show related servers", "customerserver","customer",     new {customerid = model.accountdefinition.org_id},     new ajaxoptions {  insertionmode = insertionmode.replace,  updatetargetid = "detail"  ,  loadingelementid = "progress",   onsuccess="detailsuccess",    } )</li>}</ul> 

what trying achieve set class="active" when user clicks on tab, tab user clicks on , not highlighted active? can adivce ?

i have no experience asp.net, however, know server-side framework, right? trying needs client-side javascript, here's codepen snippet: http://codepen.io/anon/pen/joemjv

they key part java script extract:

// using jquery javascript library $(document).ready(function() {     $('ul.nav li').click(function() {         // remove previous clicked tab class         $('ul.nav li').removeclass('nav-active');         // add class tab triggered click event         $(this).addclass('nav-active');     }); }); 

best regards.


Comments

Popular posts from this blog

node.js - Mongoose: Cast to ObjectId failed for value on newly created object after setting the value -

gradle error "Cannot convert the provided notation to a File or URI" -

python - NameError: name 'subprocess' is not defined -