如何在提交表单后导航到同一选项卡


How to navigate to the same tab after submitting a form?

我有一个表单来过滤数据库中的数据。我正在使用PHP和MySQL来做到这一点。现在我遇到的问题是,只要我按下"go>>"按钮,它就会重定向到第一个选项卡,即"姓氏详细信息",并在第二个选项卡中显示结果,即"搜索"。默认情况下如何导航到"搜索"选项卡?

法典:

<div class="bs-example bs-example-tabs" role="tabpanel" data-example-id="togglable-tabs">
  <ul id="myTab" class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"> <a href="#home1" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true"> <i class="fa fa-list"></i>&nbsp;surname Details</a></li>
    <li role="presentation"> <a href="#search" role="tab" id="profile-tab" data-toggle="tab" aria-controls="profile"><i class="fa fa-search"></i>&nbsp;Search</a></li>
  </ul>
  <div id="myTabContent" class="tab-content">
  <div role="tabpanel" class="tab-pane fade in active" id="home1"> you are in the surname details tab </div>
  <div role="tabpanel" class="tab-pane fade" id="search" aria-labelledby="profile-tab">
  <div class="col-md-3">
  <!--left div for displaying the form --> 
  <form action="<?php $_PHP_SELF ?>" method="post">
    <b>Select Surname: <br />
    </b>
    <select name="search" required="required"  autofocus="autofocus">
      <option value="select1">select1 </option>
      <option value="select2">select2</option>
      <option value="select3">select</option>
    </select>
    <b>Select Martial Status:</b>
    <select name="mstat" >
      <option value="">Select </option>
      <option value="Y">Married</option>
      <option value="N">Unmarried</option>
    </select>
    <strong>Select Gender:</strong>
    <input type="radio" name="sex" value="f" required id="gender_0" />
Female
    <input type="radio" name="sex" value="m" required id="gender_1" />
Male
    <b>Enter age range</b><br>
    <input type="text" name="fage" size="2">    to    <input type="text" name="tage" size="2">
    <input type="submit"  value=">>go" >
  </form>
</div>
<!--right div for displaying the result -->
<div class="col-md-9">
  The Result(s) found for the surname<?php echo $searchq;?></b>, marital status<?php echo $searchmstat;?>  gender<?php echo $searchgender;?> of age between<?php echo $searchfage;?> <?php echo $searchtage;?>is: <?php echo $output;?> 
</div>

图像

如果可能的话,我更喜欢PHP解决方案,因为我不熟悉AJAX和Javascript。提前谢谢。

我将继续假设您使用的是引导选项卡。您可以在 HTML 的以下部分更改打开的选项卡:

<?php 
     $tabToOpen = 1; //Or change to 2 under some condition
 ?>
<div role="tabpanel" class="tab-pane fade <?= $tabToOpen==1?"in":"" ?> active" id="home1"> you are in the surname details tab </div>
<div role="tabpanel" class="tab-pane fade <?= $tabToOpen==2?"in":"" ?> " id="search" aria-labelledby="profile-tab">