How to use object from Ajax request in Javascript

Question

I try to use an object receive from a Ajax request, but nothing appears. I don't see my mistake, so i'm going step by step. In this case i want to get the size value (37 in my example) from the Object (convert in json):

function modsdetails(server)
{
    clearTimeout(myReloadPageTimeout);
    $(".modal-body #detailsId").text("");
    $.ajax({
        type : "GET",
        url : url + "/modsdetails?server=" + server,
        dataType: 'json',
        success: function(data)
        {
            var parseData = JSON.parse(data);
            var detail = parseData.size;
            fillData(detail);
        },
        error : function(e)
        {
            fillData(null);
        }
    });
    $('#modalId').modal('show');
}

function fillData(data)
{
    if(data!=null)
    {
        $(".modal-body #detailsId").text(data);
    }
    else
    {
        $(".modal-body #detailsId").text("Can Not Get Data from Server!");
    }
}

I have make a test with Postman to see what is the return and that is :

{
    "ServerModsList": [
        "areas",
        "utilities"
    ],
    "DefaultModsList": [
        "beds",
        "boats",
        "bones",
        "bucket",
        "carts"
    ],
    "unknownServerModList": [],
    "size": 37
}

The result is that nothing appear in my modal windows.

Thanks for your ideas/help

and is the error callback firing? If so check the arguments for more details — charlietfl, Dec 16 '17 at 21:40
SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data — Corwin59, Dec 16 '17 at 21:41
Can you do write `console.dir(data)` right after line success: `function(data)` and share here the console result? — Elad, Dec 16 '17 at 21:43
First thing to do is to validate the response as JSON. Sounds like it might be invalid. https://jsonlint.com/ is pretty good for this. — Moob, Dec 16 '17 at 21:50
{…} ServerModsList: Array [ "areas", "utilities", … ] ServerModsList: Array [ "beds", "boats", "bones", … ] size: 37 unknownServerModList: Array [] __proto__: Object { … } modsDetails.js:27:13 SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data — Corwin59, Dec 16 '17 at 21:52
@Corwin59 The example JSON your provided does not validate as it contains trailing commas in the first two lists. — Moob, Dec 16 '17 at 21:56
@Moob you're right, but In fact the json is more longer and i cut to have not a lot of line, but in the original json, there's no extra coma, my bad — Corwin59, Dec 16 '17 at 22:02
You need to post more code so we can recreate the problem. See: https://stackoverflow.com/help/mcve — Moob, Dec 16 '17 at 22:11
So @Sanchit Patiyal, that works with direct access, but i don't understand why whithout parsing. (data.size directly) — Corwin59, Dec 16 '17 at 22:14
@Moob i have make correction in my example, i do a mistake because i don't want to make a too too long json file, very sory for that. — Corwin59, Dec 16 '17 at 22:17

Sanchit Patiyal · Accepted Answer · 2017-12-16T22:18:50.830

1

You are getting an error because you already specified dataType: 'json', jQuery automatically parsed it as JSON, causing the call to JSON.parse to fail (since the data is no longer a valid JSON string, it's a JavaScript object). You can directly access the size like this data.size. You don't have to parse it again.

edited Dec 16 '17 at 22:18

answered Dec 16 '17 at 21:53

Sanchit Patiyal

4,910
1
14
31

In fact the json is more longer and i cut to have not a lot of line, but in the original json, there's no extra coma, my bad – Corwin59 Dec 16 '17 at 21:57
@Corwin59 updated my answer :) – Sanchit Patiyal Dec 16 '17 at 22:19
1

Very well spotted! – Moob Dec 16 '17 at 22:26

Corwin59 · Answer 2 · 2017-12-16T22:23:56.673

0

With the help of @Sanchit Patiyal, i do a direct access with data.size, whithout use JSON.parse().

I'm not realy anderstand why that works whitout parsing.

Thanks for your all responses

edited Dec 16 '17 at 22:23

answered Dec 16 '17 at 22:20

Corwin59

1
4

@Crowin I added an answer. You can read there and accept that :) – Sanchit Patiyal Dec 16 '17 at 22:21
1

@Sanchit Patiyal : I do it, thanks – Corwin59 Dec 16 '17 at 22:24

How to use object from Ajax request in Javascript

2 Answers2