Tutorial :jQuery .getJSON Firefox 3 Syntax Error Undefined



Question:

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.js:

[{"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):

http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?


Solution:1

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);      } });  


Solution:2

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:

{"result":[["43001","ALEXANDRIA"],["43002","AMLIN"],["43003","ASHLEY"],["43004","BLACKLICK"],["43005","BLADENSBURG"],["43006","BRINKHAVEN"]]}  

... 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().


Solution:3

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.


Solution:4

HI

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


Solution:5

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.


Solution:6

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.


Solution:7

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.


Solution:8

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.


Solution:9

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.


Solution:10

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


Solution:11

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
Previous
Next Post »