Why does the following JQuery Ajax call result in a script error in IE9?

Question

I make the following JQuery(v1.5.1) Ajax call:

function testAjaxCall()
{
  $.ajax(
    {
        url: "/Search.ashx?",
        dataType: "json"
    });
}

This call returns the following JSON result:

{ "objectData" : "100" }

But in IE9 it fails with the following error (it works fine in other browsers):

SCRIPT1004: Expected ';' debug.finance.com, line 1 character 16

If I remove the dataType:json parameter, the call succeeds. Any idea what is wrong? I assume my JSON is incorrect, but I passed it through a validator and it did not report any errors.

Please help!

EDIT: (more detail)

I output JSON from the server in an ASP.NET HTTP Handler as follows:

public void ProcessRequest(HttpContext context)
{
    context.Response.ContentType = "application/json";
    context.Response.Write("{ \"objectData\" : \"100\" }");
    return;
}

is that where your js is included: debug.fin24.com, 'cause that's where the error is coming from — ezmilhouse, Apr 28 '11 at 09:36
have you tried enforcing strict json? where you add `"` for all inside the `data:` ? something like this `"culture": "af", "queryString": "naspers", "pageSize": 10, "pageIndex": 0 ` ? — ianace, Apr 28 '11 at 09:37
I'm afraid that's the home page and contains the "Doctype" on that line. So I assume the line nr is probably referring to dynamic script executed somewhere. — willem, Apr 28 '11 at 09:37

score 1 · Answer 1 · edited May 23 '17 at 12:19

1

Did you use JSON encoding in your server side script or did you just "build it" yourself?

When I first started fiddling with JSON I had wrongly assumed that you could just build a string of characters including curly and square brackets, colons and the like. It all looked fine when I examined XHR using the browser developer tools except what was being received was a string of characters not an object.

Then I learnt about the fact that you can just get your data on the server side, and use (for example in php) json_encode() to encode your data, and then you can use the JQUERY datatype JSON as you have done here, to parse the Javascript Object that is returned.

It's not exactly the same problem, but my question here should provide a bit more background information as to what's going on.

edited May 23 '17 at 12:19

Community

1
1

answered Apr 28 '11 at 09:46

T9b

3,312
5
31
50

I do build my JSON by-hand on the server side. I use ASP.NET and do a Response.Write to the Http Context. I'll have a look at your post, thanks. – willem Apr 28 '11 at 09:51
I'm not familiar with ASP .net, but I would hope that there is a standard encoding function, try to find it - it will save you many hours of debugging if your handbuilt JSON is not formatted correctly - it's quite sensitive you know;). One thing I forgot to mention is that the third point in the answer about setting the header text type was also important. – T9b Apr 28 '11 at 10:13
I tried using JSON.Net, which is apparently very good. In the end I get similar JSON though which I still have to return as a string. Tricky. So no luck yet. I'm downloading the JQuery source code to try and pinpoint the error... – willem Apr 28 '11 at 10:45
Looking at your code again it looks like you are just writing a string with `context.Response.Write("{ \"objectData\" : \"100\" }");` In this case it will not work, because it has to return and OBJECT. JQUERY then expects to parse the object, but because it has received a string, it will issue an error. Let me explain it another way `context.Response.Write` is writing a string back as a response it is not encoding it and sending the encoded object back. The fact that you have curly brackets does not make the data "encoded". – T9b Apr 28 '11 at 11:29

score 0 · Answer 2 · answered Nov 22 '17 at 22:49

The underlying problem here is that IE9 doesn't support JSON over AJAX. Instead, for that browser, you need to use JSON-P.

See: JavaScript: How do I create JSONP?

On the client side, change dataType as follows:

// Fall back to JSON-P for IE9 and lower:
dataType: (('withCredentials' in new XMLHttpRequest ()) ? 'json' : 'jsonp'),

On the server-side, just before you emit the JSON, do:

// In JSON-P mode, wrap the JSON with the callback name and brackets:
if (isSet ($_GET['callback']) && preg_match ('/^([_a-zA-Z0-9])$/', $_GET['callback']) ) {
    $json = $_GET['callback'] . '(' . $json . ');';
}

score 0 · Accepted Answer · edited May 23 '17 at 11:47

0

I figured out what the problem was thanks to this (slightly unrelated) post: jQuery 1.5 AJAX call fails with "invalid label" for JSON requests

The culprit was jquery.validate which was not 100% compatible with JQuery v1.5. As soon as I deleted it IE9 works perfectly!

I upgraded to jquery.validate v1.8 and everything is working beautifully now.

edited May 23 '17 at 11:47

Community

1
1

answered Apr 28 '11 at 15:36

willem

25,977
22
75
115

Why does the following JQuery Ajax call result in a script error in IE9?

3 Answers3