Converting AJAX return data to JSON

jslamka picture jslamka · Jun 6, 2011 · Viewed 34.9k times · Source

I am trying to retrieve data in a JSON object (which I have validated is correctly formatted) and output the data into the firebug console. I validated the JSON using JSONLint (http://jsonlint.com/) and know the data is not returning in JSON object because when I log it, it is logging as text rather than an object. When I look at the ajax post, there is a JSON tab and it shows the object, I just cannot retrieve it for some reason.

My ajax call is

    $.ajax({
        url:'/coords/base',
        data: { type: obj.type, id: obj.id },
        dataType:'text',
        type:'get',
        async:false,
        success: function(data) {
            console.log(data);
        }
    });

My return data looks like such:

    {   
        "1": {"name":"TEXT","coords":[        
            { "entry":3,"x":15,"y":15 }     
        ]}}

When I set the AJAX call to a variable and add .responseText; to the end of the call, I can retrieve the plaintext return of the AJAX call. I thought I could then just use $.serialize() or $.parseJSON() but then I get an error "uncaught exception: Syntax error, unrecognized expression."

The end goal would be to retrieve the content from this responseText and use the JSON object throughout my files. This call must be done synchronously because it loads in vital data.

Any help would be greatly appreciated.

Answer

Félix Saparelli picture Félix Saparelli · Jun 6, 2011

Explicitly instruct jQuery to treat the response as text:

$.ajax({
  // ...
  dataType: "text",
  // ...
});

You will then be able to get the JSON string. However, if you plan to convert it to a JS value thereafter, let me stop you: jQuery can do that for you automatically. If you specify the dataType to "json", or just let jQuery make an intelligent guess, the data argument passed to the success: function will be the parsed JSON object.