simple backbone example with rails api

Question

So I created a rails api using rails-api gem. And I put my backbone code in the default public/index.html. I tried the json link and returns json, it's just a model called 'entry' with a single field called 'content' along with some default rails fields. But the backbone code doesn't work, could you spot any problem with this? I am just trying to show the list of records from the returned json.

// Models
window.Entry = Backbone.Model.extend();
window.EntryCollection = Backbone.Collection.extend({
    model:Entry,
    url:"http://localhost:3000/entries"
});

// Views
window.EntryListView = Backbone.View.extend({
    tagName:'ul',
    initialize:function () {
        this.model.bind("reset", this.render, this);
    },
    render:function (eventName) {
        _.each(this.model.models, function (entry) {
            $(this.el).append("" + entry.get("content") + "");
        }, this);
        return this;
    }
});

// Router
var AppRouter = Backbone.Router.extend({
    routes:{
        "":"list"
    },
    list:function () {
        this.entryList = new EntryCollection();
        this.entryListView = new EntryListView({model:this.entryList});
        this.entryList.fetch();
        $('#entries').html(this.entryListView.render().el);
    }
});

var app = new AppRouter();
Backbone.history.start();

see this link = github.com/documentcloud/backbone and try this — Dipak Panchal
– Dipak Panchal, Commented Sep 28, 2012 at 7:03

Michal · Accepted Answer · 2012-09-28 11:10:16Z

0

Can You check perhaps if /entries return 'results' node? Perhaps You forgot to ActiveRecord::Base.include_root_in_json = false in Rails?

answered Sep 28, 2012 at 11:10

Michal

6181 gold badge5 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Matt · Accepted Answer · 2012-09-28 13:43:06Z

0

In your AppRouter code, you have this line:

this.entryListView = new EntryListView({model:this.entryList});

However, entryList is a Collection, not a Model, so you have to define it like this:

this.entryListView = new EntryListView({collection:this.entryList});

Similarly, in your EntryListView code, you have:

this.model.bind("reset", this.render, this);

...

_.each(this.model.models, function (entry) {

which should become:

this.collection.bind("reset", this.render, this);

...

_.each(this.collection.models, function (entry) {

I'm not sure if that is everything, but it's the only thing that is immediately apparent to me.

edit: added add'l change to this.model reference

edited Sep 28, 2012 at 13:43

answered Sep 28, 2012 at 13:37

Matt

763 bronze badges

Collectives™ on Stack Overflow

simple backbone example with rails api

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related