简体   繁体   中英

3rd Bootstrap Nav-tab not opening

Using the following code, I am unable to use the navigation of tabs well. What is happening is When I click on the first two tabs - Notices and Offers, it is displaying the relevant content and hiding the earlier one. But when I click on Students, it is only adding the content of students to the existing one. The existing one does not go away. Is there any mistake I'm doing? Any improvements required? I am using the latest bootstrap versions. Live preview can be seen at http://www.asmsocplacements.dx.am/adheretest.php

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <div role="tabpanel"> <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#home1" data-toggle="tab" role="tab" aria-controls="tab1">Notices</a></li> <li role="presentation"><a href="#paneTwo2" data-toggle="tab" role="tab" aria-controls="tab2">Offers</a></li> <li role="presentation"><a href="#paneTwo1" data-toggle="tab" role="tab" aria-controls="tab2">Students</a></li> <li role="presentation"><a href="changepassword.php">Change Password</a></li> <li role="presentation"><a href="logout.php">Logout</a></li> </ul> <div id="tabContent1" class="tab-content"> <div role="tabpanel" class="tab-pane fade in active" id="home1"> <?php include 'adminnotices.php'; ?> </div> <div role="tabpanel" class="tab-pane fade" id="paneTwo2"> <?php include 'adminoffers.php'; ?> </div> <div role="tabpanel" class="tab-pane fade" id="paneTwo1"> <?php include 'adminstudents.php'; ?> </div> </div> </div> 

<div role="tabpanel">
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#home1" data-toggle="tab" role="tab" aria-controls="tab1">Notices</a></li>
    <li role="presentation"><a href="#paneTwo2" data-toggle="tab" role="tab" aria-controls="tab2">Offers</a></li>
    <li role="presentation"><a href="#paneTwo1" data-toggle="tab" role="tab" aria-controls="tab2">Students</a></li>
    <li role="presentation"><a href="#paneTwo3">Change Password</a></li>
    <li role="presentation"><a href="#paneTwo4">Logout</a></li>
  </ul>
  <div id="tabContent1" class="tab-content">
    <div role="tabpanel" class="tab-pane fade in active" id="home1">
      <?php include 'adminnotices.php'; ?>
    </div>
    <div role="tabpanel" class="tab-pane fade" id="paneTwo2">
      <?php include 'adminoffers.php'; ?>
  </div>
    <div role="tabpanel" class="tab-pane fade" id="paneTwo1">
      <?php include 'adminstudents.php'; ?>
    </div>
<div role="tabpanel" class="tab-pane fade" id="paneTwo3">
      <?php include 'adminstudents.php'; ?>
    </div>
<div role="tabpanel" class="tab-pane fade" id="paneTwo4">
      <?php include 'adminstudents.php'; ?>
    </div>
</div>
  </div>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM