Passing Back multiple PHP variables after a ajax Form Call

Question

I am passing a file to a php file via ajax and i am returning only 1 $ variable using die($var) in the php file after a sucsessfull run...

the problem i am now facing is passing more than 1 variable back to the ajax sucess function . i have tried using json encode but it has failed to work. im thinking maybe to do with the ajax being form data.

im hoping there is a simple way top pass multiple varibles back to the sucess function.

Any help is greatly appreciated

var form_data = new FormData(); // Creating object of FormData class
form_data.append("image", file , newimagesrc) // Appending parameter named file with properties of file_field to form_data
form_data.append("oldimagesrc", oldimagesrc) // to re-write over with new image 
form_data.append("email", email)
form_data.append("imagext", fileNameSub)


$.ajax({
url: "UploadProfileImage.php",
type: "POST",
data: form_data,
processData: false,
contentType: false,
success: function(newimagesrc){ 


   //how do i pass back from php these variables
var out1=out1;
var out2=out2;
alert(out1 , out2);
  //help appreciated


var newimagesrc = newimagesrc;
//alert(newimagesrc); alert recieved message

imagename=input.files[0].name;
$('#imageupdate').css('color','green');
$('#imageupdate').text(newimagesrc);


var refreshimage = "Profileimagerefresh.php?avatar="+newimagesrc+"&email="+email;
$('#imagerefresh').load(refreshimage);


}//success 1 messagereturn1

});//ajax1

PHP FILE ('UploadProfileImage.php')

if(file_exists($oldimagelocation) && is_readable($oldimagelocation)){


$new=$rnd.$accountname.".".$extension;
if ($stat->execute(array("$new","$email"))){

unlink($oldimagelocation);
die($oldimagesrc);      //HERE I PASS 1 $ BACK  - I NEED TO RETURN MORE
exit();
}
else{
die("Failed replace image with image and rename");
exit();
}
 }

Answer 1

Using JSON encode is the best choice. I would recommend something like this:

if (file_exists($oldimagelocation) && is_readable($oldimagelocation)) {
    $new = $rnd.$accountname.".".$extension;
    if ($stat->execute([$new, $email])) {
        unlink($oldimagelocation);

        echo json_encode([
            'out1' => $oldimagelocation, 
            'out2' => $oldimagesrc, 
        ], JSON_FORCE_OBJECT);

    } else {
        die("Failed replace image with image and rename");
    }
}

Then in JS just parse the response as JSON

$.ajax({
    url: "UploadProfileImage.php",
    type: "POST",
    data: form_data,
    processData: false,
    contentType: false,
    success: function(newimagesrc){ 
        let jsonObj = JSON.parse(newimagesrc);
        console.log(jsonObj.out1);
    }
});

Answer 2

I have encountered a similar issue recently and solved this using JSON.

With PHP you can put the variables into an array and then use json_encode : and then return that onto the webpage.

Now, using your jQuery, you can use $.parseJSON which then makes it an array in jQuery.

Here's an example:

PHP:

die(json_encode(array('Hello', 'world!')));

jQuery:

$.ajax({
type: 'POST',
url: 'test.php',
}).done(function(result){
var array = $.parseJSON(result);
alert(array[0]);
});