Jquery Ajax Form Data Serialize Using PHP

Retrieving serialize data in a PHP file called using AJAX

Your js should be like this:

var str = $("form").serializeArray();
$.ajax({  
    type: "POST",  
    url: "update.php",  
    data: str,  
    success: function(value) {  
            $("#data").html(value);
    }
});

With php you should loop your result array.

$box = $_POST['box'];
foreach ($box as $x) {
    echo $x;
}

Edit:
You have to use serializeArray function in jQuery. Then it will work with this code.

How to post a form to PHP using Ajax .serialize() data?

Serialise form data after submission into

<input type="hidden" value="<?php echo base64_encode(serialize($_POST)); ?>" name="posted" />

then in ajax send this data via POST. OR you can use this --------

$( "form" ).on( "submit", function( event ) {
  event.preventDefault();
  console.log( $( this ).serialize() ); //serialize form on client side
  var pdata = {
     action: "ajaxFunction",
     postdata: $(this).serialize()
  }
  $.post( "<?php echo admin_url('admin-ajax.php'); ?>", pdata, function( data ) {
       $( ".result" ).html( data );
  });
});

serialize a form and send the serialized data with ajax using POST method

    function insertStudent(data){
        $.ajax({
            url: 'process.php',
            data: data,
            type: 'POST',
            dataType: 'json',
            success: function(str){
                 $("#result").html(str);
            }
        });     
    }

And then print $_POST in your PHP file :)

How to post form serialize data using PHP?

Get rid of the object with formdata property and only send the serialized string and add the csrf to the end of it or add the csrf to the form as a hidden input and let it get serialized also in serialize()

$("#save").click(function() {
  var formData = $('#myForm').serialize();
  formData += '&csrf_test_name=' + csrf_token

  $.ajax({
    type: "POST",
    url: base_url + 'home/save',
    data: formData,
    success: function(response) {
      console.log(response);
      alert(response)
    }
  });
});

Then in php access the same names as in form.

$fomdata=$this->input->post();

$roomCount = $fomdata['room_count_new'];
$csrfToken = $fomdata['csrf_test_name']; 

Can't retrieve jQuery serialized form data with PHP $_POST[] variable

use $(this).serializeArray() instead of $(this).serialize()

Reference:- https://api.jquery.com/serializeArray/

The difference between both:-https://stackoverflow.com/a/10430571/4248328

You need to do like below:-

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form id='contact'>
  <input type='text' name='modal_name' id='modal_name' />
  <input type='email' name='modal_email' id='modal_email' />
  <textarea name='modal_message' id='modal_message'></textarea>
  <input type="submit" value = "submit">
</form>

<script type="text/javascript">
$('#contact').on('submit', function(e) {
  e.preventDefault();
  if (modal_name && modal_email && modal_message) {
     var data = $(this).serializeArray();
     data.push({name: 'action', value: 'send_message'});
     $.post('query.php', data, function(response) {
      $('.modal').append(response);
    });
  }
});
</script>

And in php:-

<?php

if(!empty($_POST)){
    echo "<pre/>";print_r($_POST);
}
?>

It will output like this:-

<pre/>Array
(
    [modal_name] => sdsadsa
    [modal_email] => a@gmail.com
    [modal_message] => sadada
    [action] => send_message
)

Note:- if you want to use serialize()only then do like below:-

<script type="text/javascript">
$('#contact').on('submit', function(e) {
  e.preventDefault();
  if (modal_name && modal_email && modal_message) {
     var data = $(this).serialize()+ '&action=send_message';
     $.post('query.php', data, function(response) {
      $('.modal').append(response);
    });
  }
});
</script>

Serialize form data to PHP

In your PHP, you start off with this:

echo "1";

When using AJAX, an echo is the same as a return, so this is where your function stops. Remove all unnecessary echo's or your function will simply not continue.

Furthermore, you are using spaces in your HTML name attributes:

<input type="text" name="first name"> <!-- Incorrect -->

Use underscores instead or you will not be able to retrieve the value properly:

<input type="text" name="first_name"> <!-- Correct -->

Afterwards, $firstName = $_POST["first_name"]; is the correct way to retrieve your values in PHP.

jQuery post() with serialize and extra data

You can use serializeArray ^[docs] and add the additional data:

var data = $('#myForm').serializeArray();
data.push({name: 'wordlist', value: wordlist});

$.post("page.php", data);

send a form with serialize() function and extra data in ajax()

The serialize function simply creates an URL query string from all the form elements. So you can manually add the variable to the result of the serialize() function like this:

 data: $("#period-form").serialize() + '&idCompany=' + idCompany

---

Related Topics