Backbone：从客户端部分的json文件中获取数据

Question

Using Backbone.js , I would like to fetch the data from a Json file in the client part when calling the fetch method on model or collection instance.

The url property in my collection ( MyCol ) point to the following json file which looks like this:

[
  {title: "_My trip to Bali", src: "bali-trip.jpg"},
  {title: "_The flight home", src: "long-flight-oofta.jpg"},
  {title: "_Uploading pix", src: "too-many-pics.jpg"}
]

I perform the following commands:

myCol = new MyCol();
myCol.fetch(); // the Request Method GET is ok 
myCol.toJSON(); // [] 

Answer 1

Remember that fetch is not a synchronous function. The fetch method will initiate a request to the server and you are alerted to the response through an event or callback.

Take a look at the backbone documentation for the fetch method http://documentcloud.github.com/backbone/#Model-fetch .

Try doing something like this instead.

myCol = new MyCol();
myCol.fetch({
    success: function() { //This is fired if the request is succesful
        myCol.toJSON();
    }
});

Or

myCol = new MyCol();
myCol.on('change', function() { //This is fired if the model's attributes change
   myCol.toJSON();
});
myCol.fetch();

Or as @roberkules mentioned, fetch returns a jqXHR , so you could do this.

myCol = new MyCol();
myCol.fetch()
     .done(function() {
         myCol.toJSON();
      })
      .fail(function() {
          alert('Oh No!');
      });

Answer 2

@fguillen is right saying you can debug your code simply using success and error callbacks . Anyway the error is in your json format because of the members which need to be a string.

Try this and it will work:

[
  {"title": "_My trip to Bali", "src": "bali-trip.jpg"},
  {"title": "_The flight home", "src": "long-flight-oofta.jpg"},
  {"title": "_Uploading pix", "src": "too-many-pics.jpg"}
]