post value are null when use ajax - php

Question

I have this view
<div class="w3-row w3-padding-64">
<div class="w3-twothird w3-container">
<form id='create_delivery' method="post" class="form-horizontal"
enctype="multipart/form-data">
from <input type="text" name="first_address"><br>
To <input type="text" name="second_address" ><br>
<label>weight</label>
<input type="number" name="weight" ><br>
<label>price</label>
<input type="number" name="price" ><br>
<label>description</label><br>
<textarea name="description"></textarea>
<br>
<input type="submit" value="Submit">
</form>
</div>
</div>
and I sent a post request by ajax to the controller method
$(document).ready(function(){
$("#create_delivery").submit(function(evt){
var postData = $(this).serialize();
$.ajax({
url: baseURL + "deliverys/create_delivery",
type:'post',
data:postData,
dataType:'json',
success:function(data){
alert('delivery created');
}
});
evt.preventDefault();
});
});
this is the controller
public function create_delivery(){
if(isset($_POST)):
$first_address= $this->input->post('first_address');
$second_address= $this->input->post('second_address');
$description= $this->input->post('description');
$Weight= $this->input->post('Weight');
$price= $this->input->post('price');
$data = array(
"first_address"=>$first_address,
"second_address"=>$second_address,
"description"=>$description,
"Weight"=>$Weight,
"price"=>$price
);
$this->deliverys_model->create_delivery($data);
endif;
}
the problem that all the values are coming null,
it works when I send the post request without ajax
but with ajax the values are NULL
Error Number: 1048
INSERT INTO deliverys (first_address, second_address, description, ready_to_buy, Weight, price) VALUES (NULL, NULL, NULL, NULL, NULL, NULL)

Answer 1

I think you not getting form data with var postData = $(this).serialize().
Try like this $("#create_delivery").serialize()
If there is no <input type="file"> in form don't use enctype="multipart/form-data"
$(document).ready(function(){
$("#create_delivery").submit(function(evt){
evt.preventDefault();
$.ajax({
url: baseURL + "deliverys/create_delivery",
type:'POST',
data:$("#create_delivery").serialize(),
dataType:'json',
success:function(data){
alert('delivery created');
}
});
evt.preventDefault();
});
});

Answer 2

Try these
$first_address = $_POST['first_address'];
$second_address = $_POST['second_address'];
$description = $_POST['description'];
$Weight = $_POST['weight'];
$price = $_POST['price'];
Instead of
$first_address= $this->input->post('first_address');
$second_address= $this->input->post('second_address');
$description= $this->input->post('description');
$Weight= $this->input->post('Weight');
$price= $this->input->post('price');
I didn't know the context of $this->input in your code, maybe you could show more of your code, but above code should be work.

Answer 3

you need change 'type' to 'method'
$.ajax({
url: baseURL + "Trips/create_trip",
method:'POST',
data:postData,
dataType:'json',
success:function(data){
alert('Trip created');
}
});

Answer 4

.serialize(); is used to create get method string ... if you want to post data use ajax change your js with
$("#create_delivery").submit(function(evt){
evt.preventDefault();
var first_address = $( "input[name='first_address']" ).val();
var second_address = $( "input[name='second_address']" ).val();
var weight = $( "input[name='weight']" ).val();
var price = $( "input[name='price']" ).val();
var description = $( "input[name='description']" ).val();
$.ajax({
url: baseURL + "deliverys/create_delivery",
type:'post',
data : {first_address:first_address,second_address:second_address,weight:weight,price:price,description:description},
dataType:'json',
success:function(data){
alert('delivery created');
}
});
});