我希望我的 php 表单提交数据并在同一页面但不同的选项卡上重定向

Posted 2023-05-09

【中文标题】我希望我的 php 表单提交数据并在同一页面但不同的选项卡上重定向

【英文标题】：I want my php form to submit data and redirect on the same page but different tab

【发布时间】：2018-07-18 14:10:39

【问题描述】：

我有一个创建简历页面，同一页面上有四个不同的部分，每个部分都有自己的数据库表。我希望它在提交时重定向到我在提交按钮中提供的另一个 ID。

<div class="panel-body">
<ul class="nav nav-tabs nav-justified m-12" role="tablist">
   <li id="li1" class="active border-right"><a href="#cinfo"  role="tab" data-toggle="tab">Contact Information</a></li>
   <li id="li2"><a href="#binfo" role="tab" data-toggle="tab">Basic Information</a></li>
   <li id="li3"><a href="#einfo" role="tab" data-toggle="tab">Education Details</a></li>
</ul>
<div class="tab-content">
   <div class="tab-pane fade active in" id="cinfo">
      <form method="POST" enctype="multipart/form-data">
         <div class="form-group col-md-6 p-r">
            <label>Professional Title</label>
            <input type="text" name="title" class="form-control" required="required" />
         </div>
         <div class="form-group col-md-6 p-l">
            <label>First Name</label>
            <input type="text" name="fname" class="form-control" required="required" />
         </div>
         <div class="form-group col-md-6 p-r">
            <label>Last name</label>
            <input type="text" name="lname" class="form-control" required="required" />
         </div>
         <div class="form-group col-md-6 p-l">
            <label>Email</label>
            <input type="email" name="mail" class="form-control" required="required" />
         </div>
         <div class="form-group col-md-6 p-r">
            <label>Phone Number</label>
            <input type="text" name="phone" class="form-control" required="required" />
         </div>
         <!-- <div class="col-md-4 p-l"> -->
         <a href="#binfo"><button id="btn1" type="submit" name="cinfo_btn" class="btn btn-default btn-block">Next</button></a>
         <!-- </div> -->
      </form>
   </div>
   <!-- Basic Information -->
   <div class="tab-pane fade" id="binfo">
      <form method="POST" enctype="multipart/form-data">
         <div class="form-group col-md-6 p-l">
            <label>Job Title</label>
            <input type="text" name="jobtitle" class="form-control" />
         </div>
         <div class="form-group col-md-6 p-r">
            <label>Position</label>
            <input type="text" name="position" class="form-control" />
         </div>
         <div class="form-group col-md-6 p-l">
            <label>Years of Experience</label>
            <input type="text" name="exp" class="form-control" />
         </div>
         <a href="#einfo"><button id="btn2" type="submit" name="einfo_btn" class="btn btn-default btn-block">Next</button></a>
         <!-- </div> -->
      </form>
   </div>
</div>

【问题讨论】：

为此使用 ajax 调用

也添加php代码

【参考方案1】：

对您来说最好的方法是使用 ajax。 使用 ajax 提交第一个表单，然后响应成功回调 只需在下一个选项卡上触发点击事件，然后它就会带到您指定的选项卡上。

这会将标签转到第二​​个标签。

 request1 = $.ajax(
            url: "url",
            type: "POST",
            data:  yourdata
        );
        request1.done(function (response, textStatus, jqXHR) 
              $('#li2').trigger('click')
         );

这会将标签转到第三个标签。

 request2= $.ajax(
            url: "url",
            type: "POST",
            data:  yourdata
        );
        request2.done(function (response, textStatus, jqXHR) 
              $('#li3').trigger('click')
         );