Problems with passing json to php and receiving data from php

My problem is how JQuery knows when to receive data, when I watch the browser's console I see that GET call is first and then the POST call is second. It should be POST first, then GET.

I tried solving my problem with .ready,and with some IF statements and so on but I still have not achieved what I wanted to achieve. Should I use some events?

My Javscript:

 (function($) {
   $(document).ready(function() {
     $("form#userdata").submit(function(){
       $.post( "savedata.php", $("form#userdata").serialize())
         .done(function( data ) {
           alert( "Send data" + data );
        });
       return false;
       alert("Error by passing data to php");
     });

 })})(jQuery);

 $.when($.ajax("savedata.php")).then(function(){
     $.get("savedata.php", function(data){
            alert("Php returns validation errors:+data);
     });
 });

My php script:

 // Get POST data
 $postData = $_POST;

 // Print out for testing
 // print_r($postData);

 // Read data
 $fistname = $_POST['firstname'];
 $surname=$_POST['lastname'];
 $email=$_POST['email'];

 // VALIDATION


 // Build return array and return JSON
 $returnData = $postData;

 //print(json_encode($returnData));
 echo json_encode($returnData);
 ?>

Upvotes: 1

Views: 153

Answers (3)

Barmar
Barmar

Reputation: 782785

$.get is called unconditionally, while the page is loading, because you didn't put it in an event handler.

$.post is only called when you submit the #userdata form, because it's called from the .submit() event handler.

Upvotes: 2

Alexandre Wiechers Vaz
Alexandre Wiechers Vaz

Reputation: 1617

You can try something like this:

PHP:

// Get POST data
 $postData = $_POST;

 // Print out for testing
 // print_r($postData);

 // Read data
 $fistname = $_POST['firstname'];
 $surname=$_POST['lastname'];
 $email=$_POST['email'];

 // VALIDATION

 if(//validationError){
    echo json_encode(array('error' => //Your error message here));
    exit();
 }
 $returnData = $postData;

 //print(json_encode($returnData));
 echo json_encode(array('success' => $returnData));
 ?>

Then...

JS:

(function($) {

   $(document).ready(function() {

     $("form#userdata").submit(function(){

       $.post("savedata.php", $("form#userdata").serialize())
        .done(function( data ) {
           if(data.error)
              alert("Validation error: " + data.error);
           else
              alert( "Send data" + data.success );
        })
        .fail(function(){
           alert("Error by passing data to php");
        });
     });

 })})(jQuery);

Upvotes: 1

Akshay Khandelwal
Akshay Khandelwal

Reputation: 1570

You have your script incorrect

(function($) {
   $(document).ready(function() {
     $("form#userdata").submit(function(){
       $.post( "savedata.php", $("form#userdata").serialize())
         .done(function( data ) {
           alert( "Send data" + data );
        });
       return false;
       alert("Error by passing data to php");
     });

 })})(jQuery);

 $.when($.ajax("savedata.php")).then(function(){
     $.get("savedata.php", function(data){
            alert("Php returns validation errors:"+data); // You did not close the string literal and it would throw an error
     });
 });

Upvotes: 1

Related Questions