multi page form in codeigniter and save data in database after each step validation

Question

i m building multi page form ,I want each section to validate and submit to db after the user clicks "next", which is best way to do it...i have written the whole form in one page and want to save in db after the user clicks "next" but for this next button i have not writtrn type="submit" so how to pass data to controller
this the view , it display the form in multi step can any one give idea about how to save in db

<div class="container">
<div class="stepwizard">
    <div class="stepwizard-row setup-panel" >
        <div class="stepwizard-step">
            <a href="#step-1" type="button" class="btn btn-primary btn-circle">1</a>
            <p>Step 1</p>
        </div>
        <div class="stepwizard-step">
            <a href="#step-2" type="button" class="btn btn-default btn-circle" disabled="disabled">2</a>
            <p>Step 2</p>
        </div>
        <div class="stepwizard-step">
            <a href="#step-3" type="button" class="btn btn-default btn-circle" disabled="disabled">3</a>
            <p>Step 3</p>
        </div>
    </div>
</div>
<form role="form">
    <div class="row setup-content" id="step-1">
        <div class="col-xs-12">
            <div class="col-md-12">
               <div class="video-container">
            <iframe width="300" height="168" src="" frameborder="0" allowfullscreen></iframe>
            </div>
                <button class="btn btn-primary nextBtn btn-lg pull-right" type="button" >Next</button>
            </div>
        </div>
    </div>
    <div class="row setup-content" id="step-2">
        <div class="col-xs-12">
            <div class="col-md-12">
                <h3> Step 2</h3>
                <div class="form-group">
                    <table class="table table-striped b-t b-light text-sm">
                         <tr>
                        <td> <a href="<?php echo site_url("user/register") ?>" > New User  ?? </a> </td>
                        </tr>
                        <tr>
                        <th>  Email </th>
                        <td><input type="text" name="email" /> </br> </br></td>
                        </tr>
                        <tr>
                        <th>  Password </th>
                        <td> <input type="password" name="password" /> </td>
                        </tr>
                        <tr>
                        <th></th>
                        <td> <input type="submit" name="login" value="Sign in" />  </td>
                        <td></td>
                        </tr> 
                    </table>
                </div>
                <button class="btn btn-primary nextBtn btn-lg pull-right" type="button" >Next</button>
            </div>
        </div>
    </div>
    <div class="row setup-content" id="step-3">
        <div class="col-xs-12">
            <div class="col-md-12">
                <h3> Step 3</h3>
                <button class="btn btn-success btn-lg pull-right" type="button">Finish!</button>
            </div>
        </div>
    </div>
</form>
</div>

Answer 1

Hi better you try this jquery steps plugins i can help you to solve your problem its validate first then going to next step and at the end submit full form with all data. check example

http://www.jquery-steps.com/Examples