CODEWITHSUNDEEP
javascriptphpjqueryajaxarrays
M9A
M9A

Reputation: 3276

Ajax - How to use a returned array in a success function

Hi I have a php code that returns an array. I want to be able to use this array in my ajax success function but I'm not sure how to go about doing this. I have tried the following, but no luck.

php code:

$arr = array();
$arr[0] = "Mark Reed"
$arr[1] = "34";
$arr[2] = "Australia";

exit($arr);

js code:

$.ajax({
    type: "POST",
    url: "/returndetails.php",
    data: 'id=' + userid,
    success: function (data) {
        document.getElementById("name").innerHTML = data[0];
        document.getElementById("age").innerHTML = data[1];
        document.getElementById("location").innerHTML = data[2];
    }
});

Upvotes: 17

Views: 83040

Answers (4)

Waqas Qayum
Waqas Qayum

Reputation: 69

Here is solution 

$arr = array();
$arr[0] = "Mark Reed"
$arr[1] = "34";
$arr[2] = "Australia";

header("Content-Type: application/json");

echo json_encode($arr);

exit();

instead of 

$arr = array();
$arr[0] = "Mark Reed"
$arr[1] = "34";
$arr[2] = "Australia";

exit($arr);

Upvotes: 0

Tomas Grecio Ramirez
Tomas Grecio Ramirez

Reputation: 380

There a Problem , when you want display for example data[0] and data[1], it seems like a character from string. It Solves adding header("Content-Type: application/json"); before apply echo json_encode($arr)

Upvotes: 5

robby
robby

Reputation: 91

A small mistake:

Not: exit($arr);

replace with: echo json_encode($arr);

Upvotes: 9

Hugo Tunius
Hugo Tunius

Reputation: 2879

You should return the data as JSON from the server.

PHP

$arr = array();
$arr[0] = "Mark Reed";
$arr[1] = "34";
$arr[2] = "Australia";

echo json_encode($arr);
exit();

JS

$.ajax({
    type: "POST",
    url: "/returndetails.php",
    data: 'id=' + userid,
    dataType: "json", // Set the data type so jQuery can parse it for you
    success: function (data) {
        document.getElementById("name").innerHTML = data[0];
        document.getElementById("age").innerHTML = data[1];
        document.getElementById("location").innerHTML = data[2];
    }
});

Upvotes: 51

Related Questions