Printing Backbone.js collection through console.log(), what's wrong with this?

10,178

Solution 1

Have you forgot the [] to make it an array?

 echo '[{name:"James"}, {name:"Michael"}]';

Also you check the length in the onsuccess method you can pass to fetch. At the moment you check the length directly after fetching, so your not sure if the result is still loaded.

friends.fetch(
   {success:function(){
       console.log(friends.length)
   }}
);

Solution 2

fetch() is an asynchronous call, so you'll be printing to the console before the fetch() has returned to populate your collection

To verify, put a breakpoint on the console.log(friends.length) line. The breakpoint will give the fetch() time to happen

Share:
10,178
ericbae
Author by

ericbae

PHP, Javascript, MySQL, CSS - Bring it on!

Updated on June 05, 2022

Comments

  • ericbae
    ericbae over 1 year

    OK. I'm starting out on Backbone.js, and trying to do some very simple things. Here's a very simple Model and Collection.

    // my model
    Friend = Backbone.Model.extend({});
    
    // my collection
    Friends = Backbone.Collection.extend({});
    
    // instantiate friends and add some friends objects!
    var friends = new Friends();
    friends.add([
      {name: "James"},
      {name: "Michael"}
    ]);
    
    console.log(friends.length) // prints out 2! which is correct!
    

    Above example is fine. But now I want to initialize my collection from server, which returns the exact same JSON object.

    // my model
    Friend = Backbone.Model.extend({});
    
    // my collection
    Friends = Backbone.Collection.extend({
      url: 'http://localhost/myapp/get_users'
    });
    
    // instantiate friends and add some friends objects!
    var friends = new Friends();
    friends.fetch();
    
    console.log(friends.length) // prints out 0! WHY???
    

    I've been looking at my Chrome inspection panel for both of them and regardless, I have no idea why one from the server is not working?

    FYI, on the server side, I have CodeIgniter 2.02, using Phil Stuegeon's REST API to return a JSON data.

    I've also tried a simple function on my PHP side, like

    function get_users() {
      echo '{name:"James"}, {name:"Michael"}';
    }
    

    But without any success.

    What am I doing wrong here?