Backbonejs - How can I print the results of a fetch?

Question

Hi I'm new to Backbone and I was just playing around with it a little, here is my code:

    var Users = Backbone.Collection.extend ({
        url : 'http://backbonejs-beginner.herokuapp.com/users'
    });

    var users = new Users();
    users.fetch({
        success: function () {
            console.log(users);
        }
    });

The fetch call succeeds and I am returned with an object that looks like:

[
  {
    "id": "hqel839m1071rbggsxf7",
    "firstname": "Thomas",
    "lastname": "Davis",
    "age": 12
  }
]

How can I print different parts of the result? For example I want to print the "id" parameter of the first item. Can I iterate it like an array?

I tried to do console.log(users[0].id) but it doesn't work.

Thanks.

Answer 1

There are three different ways to access the models in a Backbone.Collection . First, you can use the .get method to find a model based on it's unique ID. This basically looks at all models in the collection and compares their id attribute to the one provided.

var user = collection.get('unique_id'); // return an instance, or null

The second method is to use the .at method to get a model by index. This is useful if your models are sorted. If they are not sorted, they'll be fetched by insertion order (that is, the order in which they were provided to the collection):

var user = collection.at(0); // return the first model in the collection

Lastly, you can access the raw array of models that the Collection wraps. You can access this via the .models attribute, which is just an array. This is not the recommended approach.

var user = collection.models[0];

Once you have a user, you can access any attributes of the user via the .get method on your model:

var age = user.get("age");
user.set("age", 100);

You can view the documentation for the model get method here , and the documentation for Backbone.Collection here .

Answer 2

Not to forget about the arguments passed to success callback of collection.fetch which are (collection, response, options) . Check documentation here . You can use the collection argument to select a particular model . Check below code :

var Users = Backbone.Collection.extend ({
    url : 'http://backbonejs-beginner.herokuapp.com/users'
});

var users = new Users();
users.fetch({
    success: function (collection, response, options) {
        //Will log JSON objects of all User objects
        console.log(collection.toJSON());
        //You can get a Model using 'id'
        var user = collection.get("hqesig1ea1br2k6horay");
        // Will log User Model for id "hqesig1ea1br2k6horay"
        console.log(user);
        //You can then fetch Model attributes this way
        console.log("ID: ", user.get('id'));
        console.log("First name: ", user.get('firstname'));
        console.log("Lastname : ", user.get('lastname'));
    }
});

A fiddle for your reference.