34

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.

Chesrae
  • 345
  • 1
  • 3
  • 4
  • 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! – mandubian Feb 24 '11 at 09:37
  • In your question my answer... My php was giving back using echo simple text so changing my dataType to 'text' did the job. Thanks :) – Pitto Aug 06 '13 at 07:43

4 Answers4

34

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".

ggutenberg
  • 5,654
  • 5
  • 36
  • 45
  • That may be the direction I need to go in. The reason I "need" to use "json" is because the jQuery Validation plugin I am using requires the remote validation to return JSON. – Chesrae Feb 23 '11 at 18:37
  • 5
    I just took a look at http://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". – ggutenberg Feb 23 '11 at 18:39
  • 2
    I just changed "json" to "text json" in the jQuery Validation plugin code itself and everything works perfectly. Thanks for the answer, but I am still confused why "json" was not working. The Content-Type header was set to application/json. – Chesrae Feb 23 '11 at 18:44
  • Same issue today, the incompatible validation plugin was the cause, in this case the one that comes with ASP.NET MVC3. – Andrew Mar 04 '11 at 18:26
  • dosboy, you should add your comment to the answer, dude. that saved me from hours of [looking for a solution](http://www.google.com/search?q=jquery+json+parseerror)... there are [too many](http://stackoverflow.com/questions/249692/jquery-wont-parse-my-json-from-ajax-query) [repeated](http://stackoverflow.com/questions/631418/jquery-getjson-ajax-parseerror) [(or just empty)](http://stackoverflow.com/questions/5326594/jquery-ajax-inexplicable-parseerror) questions and answers out there pointing to another direction! – cregox Apr 14 '11 at 20:23
  • You fricking legend Chesrae - helped me big time!!! ASP.Net MVC 3 also here.. Thanks! – Aaron Apr 22 '11 at 02:33
  • But still there is one question why specifying datatype to "json" only didn't work??? – Meow Jan 31 '12 at 09:59
  • If it helps anyone in the future, I had a similar problem. Specified json in the ajax call, returned perfectly formatted json, set the content type to applicaiton/json, and it was still triggering an error. Then I copy-pasted my php script into notepad++, explicitly re-saved it without BOM encoding, and tada! That was my problem all along. – orfdorf Oct 03 '15 at 03:47
12

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

Johnny Oshika
  • 45,610
  • 33
  • 151
  • 234
  • This took me a while to find too, this was the issue, the conflict in jquery.validate. – Nick Josevski Apr 07 '11 at 06:49
  • 1
    The new version (1.8) of jQuery Validation fixes this issue and is compatible with jQuery 1.5.x. More information available at: http://jquery.bassistance.de/validate/changelog.txt – Jim Geurts Apr 08 '11 at 20:26
  • This indeed is the correct answer and should be marked as such. Thanks JonnyO! – Dav Apr 13 '11 at 09:49
  • 1
    Thank you! I've been fighting with this for two hours now trying to figure out what I was doing wrong. – Craig W. Apr 30 '11 at 17:02
  • @Jim: I downloaded the new version of jQuery Validation and the problem is still present if you use the jquery.validate.min.js file. It seems to work if you use the jquery.validate.js file. – Craig W. Apr 30 '11 at 17:02
3

I also got "parsererror jQueryNNNN_NNN was not called" (using jsonp and jQuery 1.7.2) The reason was that one of the values in the returned json structure contained newlines. Hope this helps someone.

Robert
  • 31
  • 1
2

I got parseerror, because url contained a callback=? part. This is a magic string which activates JSONP functionality.

As my server side's REST API changed from JSONP to JSON, the data format returned from it was no longer compatible with jQuery.getJSON(..) with callback=?. In this situation, jQuery.getJSON(..) won't call the success callbacks, but the fail callbacks instead.

I resolved this issue by removing the callback=? part from the url parameter.

Abdull
  • 23,005
  • 22
  • 116
  • 159