Altjen B. Altjen B. - 22 days ago 9
jQuery Question

Tab Control with bootstrap not showing values of other tabs in asp.net

I am designing a tab control but is not working. when select other tabs it doesn't change the data. here's the code

<div class="container">
<ul class="nav nav-tabs">

<li><a class="active" href="#Mercedes-Benz" data-toggle="tab">Mercedes Benz</a></li>
<li><a href="#BMW" data-toggle="tab">BMW</a></li>
<li><a href="#Lamborgini" data-toggle="tab">Lamborgini</a></li>
</ul>

<div class=" tab-content">
<div class=" tab-pane fade in active" id="Mercedes-Benz">
Mercedes Benz pics
</div>
<div class=" tab-pane fade" id="BMW">
BMW pics
</div>
<div class=" tab-pane fade" id="Lamborgini">
Lambo pics
</div>
</div>
</div>


here are the imported files for this.

<link href="assets/bootstrap%203.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-2.1.1.min.cs"></script>


it just shows 'Mercedes Benz pics' even after selecting other tabs.

also, how can this be turned to vertical tab?

Answer

I can see no error there, but give a try at this, since you are using bootstrap it might help: Link1 or this.