oompahloompah
oompahloompah

Reputation: 9333

Why is this invalid JSON?

I am sending some data from an server back to a page. It looks like valid JSON to me, yet, it is being caught/handled by the error handler in my jQuery.ajax() call.

This is the error message displayed:

Error: Invalid JSON: ({"id":"#settingsResult","payload":"<form id=\"pwd_change_frm\" action=\"post\">\n    <div>\n        <div>\n            <div><\/div>\n            <div><label for=\"changepwd_password\">New Password<\/label><\/div>\n            <div><input type=\"password\" name=\"changepwd[password]\" title=\"Enter new password\" style=\"width:258px;\" id=\"changepwd_password\" \/><\/div>\n        <\/div>\n        <div class=\"spacer\">&nbsp;<\/div>\n        <div>\n            <div><\/div>\n            <div><label for=\"changepwd_password_confirm\">Confirm New Password<\/label><\/div>\n            <div><input type=\"password\" name=\"changepwd[password_confirm]\" title=\"Retype new password)\" style=\"width:258px;\" id=\"changepwd_password_confirm\" \/><\/div>\n        <\/div>\n        <div class=\"spacer\"><\/div>\n        <div><img id=\"pwd_chg_btn\" class=\"submit_btn\" src=\"\/images\/button_submit.gif\" alt=\"Button_submit\" \/><\/div>\n    <\/div>\n    <input type=\"hidden\" name=\"changepwd[_csrf_token]\" value=\"1b7f3529797245c0fc43c3ddf5ade30d\" id=\"changepwd__csrf_token\" \/><\/form>\n<div class=\"spacer\"><\/div>"})

As an aside, FF Firebug correctly parses the returned data and displays ot correctly - which is why I dont understand why jQuery can't seem to handle it.

here is the bit of code that makes the call:

jQuery.ajax({
  type: 'POST',
  url: '/some_url?id='+this.id,
  timeout: 2000,
  success: function(result){ jQuery(result.id).html(result.payload); },
  error: function (xhr, ajaxOptions, thrownError){ alert('Error: '+ thrownError); }
});

Upvotes: 2

Views: 41868

Answers (7)

Kasun Gunathilake
Kasun Gunathilake

Reputation: 1

According to json.org

JSON can be either an array or an object

An object is an unordered set of name/value pairs. An object begins with { (left brace) and ends with }

object structure

An array is an ordered collection of values. An array begins with [ (left bracket) and ends with ]

array structure

So JSON should start with either '{' or '[' and it can't start with '('

Also you use following online validator like debugjson.com to always check errors of your JSON input.

Upvotes: -1

Adrian B.
Adrian B.

Reputation: 11

The error also appears when you use jquery validate (version 1.7). You can check: http://datatables.net/forums/comments.php?DiscussionID=3993&page=1#Item_16

I also upgraded to jquery 1.5.1 and i had the same issue. After i updated jquery validate (from here: https://github.com/jzaefferer/jquery-validation) the error disappeared.

Upvotes: 1

user113716
user113716

Reputation: 322492

Probably useless to answer at this point, but I just thought I'd note that the issue does somehow seem to be with $.parseJSON().

If I remove all occurrences of \n, and replace all occurrences of \" with \', it works.

Alternatively, if I double escape them, it works.

\\n
\\"

...which would make sense since I believe jQuery simply does an eval() (or effectively the same thing), so I guess escaping the " is terminating the string and escaping the \n is introducing a newline character where it would be invalid.

Upvotes: 7

Nat
Nat

Reputation: 15

jquery requires that you supply "dataType: json" unless you supply the proper content type in your serverside code like "header('Content-type: application/json');"

Upvotes: 0

D.Shawley
D.Shawley

Reputation: 59563

What is the actual JSON that is being passed? The string in the error message:

{"id":"#settingsResult",
 "payload":"\n \n \n <\/div>\n New Password<\/label><\/div>\n <\/div>\n <\/div>\n  <\/div>\n \n <\/div>\n Confirm New Password<\/label><\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/form>\n<\/div>"}

is valid according to JSONLint. Are you including the parens?

Update after Question Changed

Is it possible that <\/div> is somehow confusing things? This isn't valid HTML so I don't know what jQuery(result.id).html(result.payload) is going to do with it.

Upvotes: 0

Quentin
Quentin

Reputation: 943470

Since everything else appears to be valid, the problem is likely that you are including ( and ) in the data.

Upvotes: 1

ntziolis
ntziolis

Reputation: 10221

Because of the surrounding '()', remove it and its valid json.

Upvotes: 4

Related Questions