javascript - Store Data in each step or at final step

Question

This is admission form of college. I want user to enter their name email phone on first stage and just after clicking next their info should be saved. Until now it's working.

Here comes next part, I used AJAX for stepwise form, after filling, and properly inserting data to database at first step (without AJAX), when user comes to next step (AJAX start), it takes data from user in 3-4 steps, and I want to store info in each step, if not possible then at the end of form I want these detail to be stored in same table as of First stage which stores just name email phone.

How to store these fields in the database.

FILE NAME addinfo.php (Ajax form)

<?php
// require_once 'app/config/config.php';
$conn=mysqli_connect("localhost","root","","lmsapp");
$fname = $_POST['fname'];
$lname = $_POST['lname'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$acode = $_POST['acode'];
$program_intrested = $_POST['program_intrested'];


if(isset($_POST['submitinfo'])) {
    $queryinsert = "INSERT INTO students (fname, lname, email, phone, autocode, program_intrested) VALUES ('".$_POST["fname"]."', '".$_POST["lname"]."', '".$_POST["email"]."', '".$_POST["phone"]."', '".$_POST["acode"]."' , '".$_POST["program_intrested"]."')";
    
    $result = mysqli_query($conn,$queryinsert);

  

?>

                <div class="form-body smart-steps stp-three">
                 <form method="post" action="index.php" id="smart-form">
            
                            <h2><i class="fa fa-user"></i>Basic Info</h2>
                            <fieldset>
                            


                                <div class="frm-row">
                                    <div class="section colm colm12">
                                        <label class="field prepend-icon">
                                            <span class="stdimage">
                                                <input type="file" name="stf_image" id="std_image" class="gui-input" placeholder="Upload Student Image">
                                                <img src="images/stdimage.png">
                                                Upload Student Image
                                            </span>
                                        </label>
                                    </div><!-- end section -->             
                                </div><!-- end frm-row section -->


                                
                                <div class="frm-row">
                                    <div class="section colm colm6">
                                        <label class="field select">
                                            <select id="gender" name="gender">
                                                <option value="" selected disabled>Gender</option>
                                                <option value="Male">Male</option>
                                                <option value="Female">Female</option>
                                            </select>
                                            <i class="arrow double"></i>                             
                                        </label>
                                    </div><!-- end section -->
                                    
                                   <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="date" name="birthday" id="birthday" class="gui-input" placeholder="Date of Birth">
                                            <span class="field-icon"><i class="fa fa-calendar"></i></span>  
                                        </label>
                                    </div><!-- end section -->   
                                </div><!-- end frm-row section -->                                
                                
                                <div class="frm-row">
                                    <div class="section colm colm4">
                                        <label class="field select">
                                          <select id="nationality" name="nationality">
                                              <option value="" selected disabled>Nationality</option>
                                              <option value="afghan">Afghan</option>
                                              <option value="albanian">Albanian</option>
                                              <option value="algerian">Algerian</option>
                                              <option value="american">American</option>
                                              <option value="andorran">Andorran</option>
                                              <option value="angolan">Angolan</option>
                                              <option value="antiguans">Antiguans</option>
                                              
                                              <option value="zimbabwean">Zimbabwean</option>
                                          </select>
                                          <i class="arrow double"></i>                   
                                        </label>
                                    </div><!-- end section -->   
                                   
                                    
                                    <!-- <div class="section colm colm4">
                                        <label class="field prepend-icon">
                                            <input type="text" name="contact" id="contact" class="gui-input" placeholder="Contact">
                                            <span class="field-icon"><i class="fa fa-fax"></i></span>  
                                        </label>
                                    </div><!-- end section --> 
                                                  
             <!--                    </div><!-- end frm-row section -->
                                
                                <!-- <div class="frm-row"> -->
                                     <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="text" name="formb" id="formb" class="gui-input" placeholder="Form 'B'/Passport Number">
                                            <span class="field-icon"><i class="fa fa-check"></i></span>  
                                        </label>
                                    </div><!-- end section -->
                                    
                                    <!-- <div class="section colm colm6">
                                        <label class="field">
                                            <input type="text" name="passport" id="passport" class="gui-input" placeholder="Passport Number">
                                        </label>
                                    </div> --><!-- end section -->               
                                </div><!-- end frm-row section --> 
                                                                                                                             
                                
                            </fieldset>

                            <h2><i class="fa fa-user-o"></i>Guardian Info</h2>
                            <fieldset>
                            
                                <div class="frm-row">
                                    <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="text" name="gdname" id="gdname" class="gui-input" placeholder="Name">
                                            <span class="field-icon"><i class="fa fa-user"></i></span>  
                                        </label>
                                    </div><!-- end section -->
                                    
                                    <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="text" name="relation" id="relation" class="gui-input" placeholder="Relation">
                                            <span class="field-icon"><i class="fa fa-heart-o"></i></span>  
                                        </label>
                                    </div><!-- end section -->
                                </div><!-- end .frm-row section -->
                                
                                <div class="frm-row">
                                    <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="text" name="gdqualification" id="gdqualification" class="gui-input" placeholder="Qualification">
                                            <span class="field-icon"><i class="fa fa-graduation-cap"></i></span>  
                                        </label>
                                    </div><!-- end section -->
                                    
                                    <div class="section colm colm6">
                                        <label class="field prepend-icon">
                                            <input type="tel" name="gdphone" id="gdphone" class="gui-input" placeholder="Contact Number">
                                            <sp

Answer 1

等待大神答复