Thursday, May 3, 2012

jQuery JSON response always triggers a ParseError


I am trying to preform some basic operations with jQuery and JSON. Presently having difficulty with jQuery accepting JSON response from my play framework application. Below is a simplified version of the code that still produces the error.




$.ajax({
type: 'POST',
url: "@{FrontEnd.isUsernameAvailable()}",
data: "name=thisnameisavailable",
cache: false,
success: function(data) {
console.log("Success... ");
},
error: function(jqXHR, textStatus, errorThrown) {
console.log("Error... " + textStatus + " " + errorThrown);
},
dataType: 'json'
});



The error callback is always triggered. It displays




Error... parsererror jQuery15001997238997904205_1298484897373 was not called




Inspecting the returned JSON through Firebug shows no errors and various JSON lint tools also validate. Changing dataType to "text" makes success be called. But I am trying to use the isUsernameAvailable call as part of jQuery validation plugin so I need it to return valid JSON.


Source: Tips4all

4 comments:

  1. Maybe I'm misunderstanding, but couldn't you set the dataType to text and JSON.parse() the returned data?

    success: function(data) {
    data = JSON.parse(data);
    // process data
    },


    Edited to add generally agreed upon solution (previously a comment only):

    I just took a look at api.jquery.com/jQuery.ajax and it looks like with jQuery 1.5 you can do a type conversion of sorts. "multiple, space-separated values: As of jQuery 1.5, jQuery can convert a dataType from what it received in the Content-Type header to what you require. For example, if you want a text response to be treated as XML, use "text xml" for the dataType." Maybe you can try "text json".

    ReplyDelete
  2. I got the same error as soon as I upgraded to jQuery 1.5. It turns out that my problem is because I'm also using the jquery validation plugin, which is not compatible with jQuery 1.5. If I remove the jquery validation plugin, $.ajax() with dataType json works fine.

    More information about the jquery validation plugin incompatibility here:
    http://bugs.jquery.com/ticket/8118

    ReplyDelete
  3. Are you sure the response is of type application/json (I think the answer is yes ;)) and your json is like { "field":"value", ... }... the double quote are sometimes important if your values are string typed and not boolean or int... and no orphaned ","...
    Anyway, you seem to have a workaround!

    ReplyDelete
  4. thank you so much for the trick of using "text json"

    I used http://ws.geonames.org/searchJSON in JQueryUI Autocomplete sample. in that case "jsonp" works fine. I mimiced the response with the same result and it did not work. Contect-Type was same "application/json;charset=UTF-8". Just curious why the trick works.

    ReplyDelete