如何在AJAX响应中返回数组和HTML数据？

Question

I have an array like this in my PHP page named new1.php:

$arr = ['value 1', 'value 2', 'value 3'];
$html = '<div>huge data with all tags like a page</div>';
$response = json_encode('array' => $arr, 'html' => $html);
echo $response

In the calling page, when I console.log(data.html) it gives undefined . The same happens for console.log(data.array); . Here is my AJAX code:

$.ajax({
    url: "new1.php",
    type: "POST", 
    data: { somedata: somedata },
    dataType: "text",
    success: function(data) {
        console.log(data);
        console.log(data.html);
        console.log(data.array);
    }
});

Most importantly, I want to know what is the best way to return a page with other data from AJAX response?

Answer 1

You should be json parse, because you are json encoding from php file, and as there is data type of your ajax is text so you need to parse the json.

 $.ajax({
         url:"new1.php",
         type:"POST",
         data:{somedata:somedata},
         dataType:"text",
         success: function(data){
                data = JSON.parse(data);
                  console.log(data);
                console.log(data.html);
                console.log(data.array);

            }
    });

Answer 2

from your php code where you do json_encode add this to the top of the page header("Content-Type: application/json"); then your encode should take in array as parameter instead

json_encode(array("array"=>$arr, "html"=>$html));

it should see your record as json now and please change ur dataType to json from Jquery intelligence guess from the server state ( jquery ) it will automatically take json instead

dataType (default: Intelligent Guess (xml, json, script, or html)) Type: String The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). The available types (and the result passed as the first argument to your success callback) are: