Tutorial :jQuery .getJSON Firefox 3 Syntax Error Undefined


I'm getting a syntax error (undefined line 1 test.js) in Firefox 3 when I run this code. The alert works properly (it displays 'work') but I have no idea why I am receiving the syntax error.

jQuery code:

$.getJSON("json/test.js", function(data) {      alert(data[0].test);  });  


[{"test": "work"}]  

Any ideas? I'm working on this for a larger .js file but I've narrowed it down to this code. What's crazy is if I replace the local file with a remote path there is no syntax error (here's an example):



I found a solution to kick that error

$.ajaxSetup({'beforeSend': function(xhr){      if (xhr.overrideMimeType)          xhr.overrideMimeType("text/plain");      }  });  

Now the explanation: In firefox 3 (and I asume only firefox THREE) every file that has the mime-type of "text/xml" is parsed and syntax-checked. If you start your JSON with an "[" it will raise an Syntax Error, if it starts with "{" it's an "Malformed Error" (my translation for "nicht wohlgeformt"). If I access my json-file from an local script - no server is included in this progress - I have to override the mime-type... Maybe you set your MIME-Type for that very file wrong...

How ever, adding this little piece of code will save you from an error-message

Edit: In jquery 1.5.1 or higher, you can use the mimeType option to achieve the same effect. To set it as a default for all requests, use

$.ajaxSetup({ mimeType: "text/plain" });  

You can also use it with $.ajax directly, i.e., your calls translates to

$.ajax({      url: "json/test.js",      dataType: "json",      mimeType: "textPlain",      success: function(data){          alert(data[0].test);      } });  


getJSON may be insisting on at least one name:value pair.
A straight array ["item0","item1","Item2"] is valid JSON, but there's nothing to reference it with in the callback function for getJSON.

In this little array of Zip codes:


... I was stuck until I added the {"result": tag. Afterward I could reference it:

<script>         $.getJSON("temp_test_json.php","",          function(data) {              $.each(data.result, function(i, item) {                  alert(item[0]+ " " + i);                  if (i > 4 ) return false;                });          });  </script>  

... I also found it was just easier to use $.each().


This may sound really really dumb, but change the file extension for test.js from .js to .txt. I had the same thing happen with perfectly valid JSON data files with pretty well any extension except .txt (example: .json, .i18n). Since I've changed the extension, I get the data and use it just fine.

Like I said, it may sound dumb but it worked for me.



I have this same error when testing the web page on my local PC, but once it is up on the hosting server the error no longer happens. Sorry - I have no idea of the reason, but thought it may help someone else track down the reason


Try renaming "test.js" to "test.json", which is what Wikipedia says is the official extension for JSON files. Maybe it's being processed as Javascript at some point.


Have you tried disabling all the Firefox extensions?

I usually get some errors in the Firebug console that are caused by the extensions, not by the webs being visited.


Check if there's ; at the end of the test.js. jQuery executes eval("(" + data + ")") and semicolon would prevent Firefox from finding closing parenthesis. And there might be some other unseen characters that prevents it from doing so.

I can tell you why this remote location working though, it's because it's executed in completely different manner. Since it has jsoncallback=? as the part of query parameters, jQuery thinks of it as of JSONP and actually inserts it into the DOM inside <script> tags. Try use "json/test.js?callback=?" as target, it might help too.


What kind of webserver are you running that on? I once had an issue reading a JSON file on IIS because it wasn't defined as a valid MIME type.


Try configuring the content type of the .js file. Firefox expects it to be text/plain, apparently. You can do that as Peter Hoffmann does above, or you can set the content type header server side.

This might mean a server-side configuration change (like apache's mime.types file), or if the json is served from a script, setting the content-type header in the script.

Or at least that seems to have made the error go away for me.


I had a similar problem but was looping through a for loop. I think the problem might be that the index is out of bound.

  • Kien


For the people who don't use jQuery, you need to call the overrideMimeType method before sending the request:

var r = new XMLHttpRequest();  r.open("GET", filepath, true);  r.overrideMimeType("text/plain");  

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Next Post »