How to pass data from post to ajax in codeigniter

Question

So i have table and trying to do C.R.U.D.

I make for edit form with modal. As my table populate inside of foreach i put my modal inside in table to get correct id of row.

This is my ajax function

 $("#uin").click(function(){
var mydata = $("form#update-interview").serialize();
var id = $("#jsonid").val();
console.log(mydata); // it's only for test

    $.ajax({
        type: "POST",
        url: "vacancy/interview/" + id , //process
        data: { user_submission_token: $("#session_token").val(),mydata },
        dataType: "json",            
                    success: function(msg){
            alert("Succeess");
            $("#form-content").modal('hide'); //hide popup  
        },
        error: function(){
            alert("failure");
        }
    });
});

From this Ajax Submit im getting output like:

candidate_id=120&vacancy_id=48&stage=Interview&date=&candidate_id=120&vacancy_id=49&stage=Interview&date=&candidate_id=120&vacancy_id=53&stage=Interview&date=&candidate_id=120&vacancy_id=54&stage=Interview&date=&candidate_id=120

and this continues until last ID, so i need to get only 1 candidate_id ,vacancy_id and stage with date.

Its getting all of them because is inside in foreach but if i put my form outside of foreach then how i will get my row ID?

this is my function in controller

 public function interview($i) 

    {
        $type=$this->input->post();
    $test=  json_encode($data= array(
            "status" => 1,
            "candidate_id" => $this->input->post('candidate_id'),
            "vacancy_id" => $this->input->post('vacancy_id'),
            "date" => $this->input->post('date'),
            "stage" => $type[3],
        )
    );
    var_dump($test);
            die();
        $this->vacancies->update_interview($data, array("vacancy_id" => $i));

    }

from this controller var_dump i got this output {"status":1,"candidate_id":false,"vacancy_id":false,"date":false,"stage":null}

seems my function is not correct also, can i get some advice?

and model side is just this

    public function update_interview($i) 
{       
    $this->db->insert("interviews", $i);
}

For any case this is my form its little-bit long

                     <!-- Update  Interview-->
   <div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->

    <form class="no-error-margin" id="update-interview">
    <div class="modal-content">
      <div class="modal-body">
   <div class="form-group">
               <input type="hidden" name='candidate_id' value="<?= $candidate_id; ?>" />
               <input type="hidden" name='vacancy_id' id="jsonid" value="<?= $row['id']; ?>" />

   </div>

        <div class="form-group">
        <label class="control-label">Type:</label>
            <select id="classinput" tabindex="1" name="stage" class="form-control required">
                  <option value="Interview">Interview</option>
                  <option value="Final Interview">Final Interview</option>
                  <option value="">Rejected</option>
            </select>
         </div>    
             <!-- Using DatePicker-->

        <div class="date-form">
        <div class="control-group">
        <label class="control-label" style="margin: 0 30%;padding: 7px;">When The Interview Will Be?</label>
    <div class="container">
    <div class="row">
        <div class='col-sm-6 col-md-offset-3'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input name="date" type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        </div>
        </div>   
      </div>
        </div>
      </div>
      <div class="modal-footer">
  <button id="uin" type="submit" data-dismiss="modal" class="btn btn-warning btn-lg" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span> Update</button>
      </div>
    </div>
<?php   echo   form_close();?>
  </div>
</div>
<!-- End  Interview--> 

UPDATE:

Okay thanks to Niranjan N Raju

Now i'm getting just 1 result in POST and its correct which is looks like

candidate_id=126&vacancy_id=46&stage=Interview&date=12/03/2015+12:00+AM

So now how to insert this into database? Into candidate_id , vacancy_id , stage and date columns with their values?

Answer 1

$("#uin").click(function(){
    var mydata = $("form#update-interview").serialize();
    var id = $("#jsonid").val();
    mydata.push({user_submission_token: $("#session_token").val()
});

$.ajax({
    type: "POST",
    url: "vacancy/interview/" + id ,
    data: mydata,
    dataType: "json",            
    success: function(msg){
        alert("Succeess");
        $("#form-content").modal('hide');
    },
    error: function(){
        alert("failure");
    }
    });
});

Answer 2

this is wrong,

data: { user_submission_token: $("#session_token").val(),mydata },

It should be

data: { user_submission_token: $("#session_token").val(),mydata:mydata },
                                                         ^           ^

data is always is passed as {key:value,key:value}

But you are passing only key.