Question

I’m using Jquery to fetch a json file, and I’m getting errors in the browser (Unexpected token : )

Here’s my javascript:

fetchScenes: function() {
        $j.ajax({
            crossDomain:true,
            url: 'xml/scenes.json',
            dataType: "jsonp",
            success: function( sceneXML ) {

            }
        }); 
    },

Here’s a partial structure from my json:

{ "scenes": {
    "scene": {
      "-id": "0",
      "-name": "Master",
      "scene": [
        {
          "-id": "1",
          "-name": "Weekday Vehicle",
          "-description": "Your home away from home.",
          "scene": [
            {
              "-id": "10",
              "-name": "For My Commute",
              "scene": [
                {
                  "-id": "13",
                  "-name": "Heading to School",
                  "scene": [
                    {
                      "-id": "20",
                      "-name": "Style Seeker",
                      "-vehicles": "1,3,6"
                    },
                    {
                      "-id": "21",
                      "-name": "Creative Thinker",
                      "-vehicles": "9,0,3"
                    }
                  ]
                },

I validated the JSON with JSONLint, so I’m not sure what the problem is.

Answer 1

If you tell jQuery to expect JSONP, you have to send JSONP ^[Wikipedia], not JSON.

I.e. the response would be someFunctionName({...json here...}); where someFunctionName is usually the value of the callback parameter sent with the URL (generated by jQuery automatically).

jQuery is evaluating the response as JavaScript, which generates an error in your case, since plain JSON is invalid JavaScript.

---

Or if it is actually not a cross-domain request (xml/scenes.json is a “local” URL), change dataType: "jsonp" to dataType: "json" (and remove crossDomain).