Using Handlebars.js with StackMob

Question

What I'm trying to do is when the page is loaded it will show the user a list of all their "contacts". There is a fair bit of code so I put it all HERE and below is just the load method.

$(window).load(function () {
        var Contacts = StackMob.Model.extend({ schemaName: 'contacts' });
        var myContacts = new Contacts();
        var q = new StackMob.Collection.Query();
        q.orderAsc('firstname'); //sort by firstname in ascending order
        myContacts.query(q, {
            success: function (model) {
                console.log(model.toJSON());

                for (var i = 0; i < model.length; i++) {
                    var data = ({
                        FirstName: model[i].attributes.firstname,
                        LastName: model[i].attributes.lastname,
                        Pno: model[i].attributes.phoneno,
                        Emails: model[i].attributes.email,
                        objIdel: model[i].contacts_id,
                        objIdeit: model[i].contacts_id
                    });
                    var template = Handlebars.compile($('#template').html());

                    var html = template(model);

                    $("#contacts").append(template(data));
                }
            },
            error: function (model, response) {
                console.debug(response);
            }
        });
    });

console.log(model.toJSON()); shows what I would expect but It doesn't seem to be getting into the for loop at all.

EDIT: If i get rid of the loop and use the code below I get only one contact with no values in the inputs

var data = ({
                        FirstName: model.attributes.firstname,
                        LastName: model.attributes.lastname,
                        Pno: model.attributes.phoneno,
                        Emails: model.attributes.email,
                        objIdel: model.contacts_id,
                        objIdeit: model.contacts_id
                    });

EDIT: I was able to get the firstname of a contact using console.log(results.attributes[0]["firstname"]); the problem is I cant figure out why its not going into the loop.

I tested the code without the loop and it made a handlebars template of the first contact that worked as planed, but I cant figure out why it wont loop through them all. Link to a more up to date version of the code

score 1 · Accepted Answer · answered Jun 17 '13 at 21:35

How about trying this ... I iterate over the jsonData to get each object. Not sure if handlebars expects a JSON object or the JSON string, so I output each to the console.log

var Contact = StackMob.Model.extend({ schemaName: 'todo' });
var Contacts = StackMob.Collection.extend({ model: Contact });

var q = new StackMob.Collection.Query();    
q.orderAsc('name'); //sort by firstname in ascending order

var myContacts = new Contacts();
myContacts.query(q, {
  success: function (data) {

    jsonData = data.toJSON();

    for (var i = 0; i < data.length; i++) {
      var obj = jsonData[i];
      console.log(obj);
      console.log(JSON.stringify(obj));
    }

  },
  error: function (model, response) {
    console.debug(response);
  }
});

Thanks for the help. What I did was where you have data.length, I used Object.length and that worked along side of the code I had in my previous examples. — Thomas Mannion, Jun 19 '13 at 10:12

Using Handlebars.js with StackMob

1 Answers1