I am quite new to backbone js and Mustache. I am trying to load the backbone collection (Object array) on page load from rails json object to save the extra call . I am having troubles rendering the backbone collection using mustache template.

My model & collection are

var Item =  Backbone.Model.extend({

});

App.Collections.Items= Backbone.Collection.extend({
    model: Item,
    url: '/items'
});

and view

App.Views.Index = Backbone.View.extend({
    el : '#itemList',
    initialize: function() {
        this.render();
    },

    render: function() {
        $(this.el).html(Mustache.to_html(JST.item_template(),this.collection ));
        //var test = {name:"test",price:100};
        //$(this.el).html(Mustache.to_html(JST.item_template(),test ));
    }
});

In the above view render, i can able to render the single model (commented test obeject), but not the collections. I am totally struck here, i have tried with both underscore templating & mustache but no luck.

And this is the Template

<li>
<div>
  <div style="float: left; width: 70px">
    <a href="#">
      <img class="thumbnail" src="http://placehold.it/60x60" alt="">
    </a>
  </div>
  <div style="float: right; width: 292px">
    <h4> {{name}} <span class="price">Rs {{price}}</span></h4>
  </div>
  </div>
</li>

and my object array kind of looks like this