javascript - JSON.parse object returning undefined values - Stack Overflow

admin管理员组

文章数量:1415111

I have an ajax request that returns some pretty basic data from a form submit, as shown.

PHP:

if ( ! empty($errors)) {

    // if there are items in our errors array, return those errors
    $data['success'] = false;
    $data['errors']  = $errors;
} else {

    $outputArray = array();

    $outputArray[] = array(
        'students' => base64_encode($_POST['students']),
        'sub' => $_POST['subject'],
        'topic' => $_POST['topic'],
        'class' => $_POST['class'],
        'checked' =>  $_POST['checked'],
        'pronoun' => $_POST['slider']
    );

    // if there are no errors process our form, then show a message of success and provide a true success variable
    $data['success'] = true;
    $data['message'] = json_encode($outputArray);
}

// return all our data to an AJAX call
echo json_encode($data);

Javascript:

$.ajax({
    type: 'POST',
    url: 'processBatch.php',
    data: formData,
    dataType: 'json',
    encode: true
})

.done(function(data) {
    if (!data.success) {
        // error handling goes here. Removed for clarity. 
    } else {
        // ALL GOOD!
        console.log(data.message);

        var obj1 = $.parseJSON(data.message);
        var obj2 = JSON.parse(data.message);

        console.log("Subject is: " + obj1.sub);
        console.log("Subject is: " + obj2.sub);
    }
}

On the face of it, all seems good - the returned data seems to be valid JSON (JSONlint clears it as being valid), but when I use JSON.parse to convert it to an object, and try to reference the values in that object, the returned value is always undefined. I've also tried $.parseJSON and the result is the same.

Everything looks okay to me, so any advice would be appreciated.

SAMPLE RETURNED STRING

[{
    "students": "TWlrZQpCb2IK",
    "sub": "English",
    "topic": "Test topic",
    "class": "Test classname",
    "checked": "WzEsNSw5XQ==",
    "pronoun": "2"
}]

I have an ajax request that returns some pretty basic data from a form submit, as shown.

PHP:

if ( ! empty($errors)) {

    // if there are items in our errors array, return those errors
    $data['success'] = false;
    $data['errors']  = $errors;
} else {

    $outputArray = array();

    $outputArray[] = array(
        'students' => base64_encode($_POST['students']),
        'sub' => $_POST['subject'],
        'topic' => $_POST['topic'],
        'class' => $_POST['class'],
        'checked' =>  $_POST['checked'],
        'pronoun' => $_POST['slider']
    );

    // if there are no errors process our form, then show a message of success and provide a true success variable
    $data['success'] = true;
    $data['message'] = json_encode($outputArray);
}

// return all our data to an AJAX call
echo json_encode($data);

Javascript:

$.ajax({
    type: 'POST',
    url: 'processBatch.php',
    data: formData,
    dataType: 'json',
    encode: true
})

.done(function(data) {
    if (!data.success) {
        // error handling goes here. Removed for clarity. 
    } else {
        // ALL GOOD!
        console.log(data.message);

        var obj1 = $.parseJSON(data.message);
        var obj2 = JSON.parse(data.message);

        console.log("Subject is: " + obj1.sub);
        console.log("Subject is: " + obj2.sub);
    }
}

On the face of it, all seems good - the returned data seems to be valid JSON (JSONlint clears it as being valid), but when I use JSON.parse to convert it to an object, and try to reference the values in that object, the returned value is always undefined. I've also tried $.parseJSON and the result is the same.

Everything looks okay to me, so any advice would be appreciated.

SAMPLE RETURNED STRING

[{
    "students": "TWlrZQpCb2IK",
    "sub": "English",
    "topic": "Test topic",
    "class": "Test classname",
    "checked": "WzEsNSw5XQ==",
    "pronoun": "2"
}]

• javascript
• php
• jquery
• json

Share Improve this question Follow asked Nov 16, 2016 at 8:37 user6790086user6790086 24411 gold badge33 silver badges1010 bronze badges 4

• 1 Could you give a sample of the returned data object as a whole – Rory McCrossan Commented Nov 16, 2016 at 8:38
• what you found in cosole.log(data.message) ? means edit your question with whole object. – Bhavin Commented Nov 16, 2016 at 8:38
• Try logging data. There seems to be issues with .sub. – Rajesh Commented Nov 16, 2016 at 8:40
• logging data returns the following: {success: true, message: "[{\"students\":\"TWlrZQpCb2I=\",\"sub\":\"English\",\"topic\":\"test Topic\",\"class\":\"test Class\",\"checked\":\"WzEsNSw5XQ==\",\"pronoun\":\"2\"}]"} – user6790086 Commented Nov 16, 2016 at 8:46

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

Your JSON is an array. Use array index while accessing the element.

console.log(data.message);
console.log("Subject is: " + data.message[0].sub);

---

Another approach is to restructure the array returned from AJAX file i.e. change $outputArray[] to $outputArray. Below is the example

$outputArray = array();

$outputArray = array(
    'students' => base64_encode($_POST['students']),
    'sub' => $_POST['subject'],
    'topic' => $_POST['topic'],
    'class' => $_POST['class'],
    'checked' =>  $_POST['checked'],
    'pronoun' => $_POST['slider']
);

Now, in JS file you can access element directly without array index.

 console.log(data.message);
 console.log("Subject is: " + data.message.sub);

If you make a JSON.stringify(data) ?

本文标签： javascriptJSONparse object returning undefined valuesStack Overflow