No attributes in backbone model

280 Views Asked by At

I'm looking at an example from http://www.backbonerails.com/ which looks exactly the same. Let me just draw you a picture from my app:

routes:

routes.rb:

Mario::Application.routes.draw do
  root to: 'application#index'

  resources :conferences
  resources :participations, only: [:create]
end

controller:

class ConferencesController < ApplicationController
  respond_to :json

  def show
    @conference = Conference.find params[:id]
  end

  def index
    @conferences = Conference.all
  end
end

rabl template:

rsponse formatted by index.json.rabl:

collection @conferences
attributes :id, :title
node(:date_from){|c| I18n.l c.date_from, format: :short}
node(:date_to){|c| I18n.l c.date_to, format: :short}
node(:lectures) do |c|
  c.lectures_by_day.map do |l|
    partial 'lectures/base', object: l
  end
end

response

This is the response I get from http://localhost:3000/conferences.json:

[
  {
    "id": 1,
    "title": "Ruby on Rails for Dummies",
    "date_from": "11 Dec 12:00",
    "date_to": "13 Dec 17:00",
    "lectures": []
  }
]

backbone model

This is the Backbone model that is supposed to fetch from here:

@Mario.module "Entities", (Entities, App, Backbone, Marionette, $, _) ->

  class Entities.Conference extends Backbone.Model
    defaults:
      title: ''

  class Entities.ConferenceCollection extends Backbone.Collection
    model: Entities.Conference
    url: '/conferences.json'

...and finally JS console:

And this is what I get in the end in the js console:

cc=new Mario.Entities.ConferenceCollection()

▹ConferenceCollection {length: 0, models: Array[0], _byId: Object, constructor: function, model: function…}

cc.fetch()

At this point rails server responded thusly (from log/development.log)

2013-12-11T18:07:55+01:00 [ INFO] 40497 : Started GET "/conferences.json" for 127.0.0.1 at 2013-12-11 18:07:55 +0100
2013-12-11T18:07:55+01:00 [ INFO] 40497 : Processing by ConferencesController#index as JSON
2013-12-11T18:07:55+01:00 [DEBUG] 40497 :   Conference Load (0.2ms)  SELECT "conferences".* FROM "conferences"
2013-12-11T18:07:55+01:00 [DEBUG] 40497 :    (0.1ms)  SELECT COUNT(*) FROM "lectures" WHERE "lectures"."conference_id" = 1 AND ("lectures"."date_from" BETWEEN '2013-12-11' AND '2013-12-12')
2013-12-11T18:07:55+01:00 [ INFO] 40497 :   Rendered conferences/index.json.rabl (14.2ms)
2013-12-11T18:07:55+01:00 [ INFO] 40497 : Completed 200 OK in 20ms (Views: 18.3ms | ActiveRecord: 0.5ms)

Going back to js console:

cc.models[0]

▹Conference {cid: "c6", attributes: Object, collection: ConferenceCollection, _changing: false, _previousAttributes: Object…}

cc.models[0].attributes

▽attributes: Object
  ▹_byId: Object
  ▹_onModelEvent: function (event, model, collection, options) {
  ▹_prepareModel: function (attrs, options) {
  ▹_removeReference: function (model) {
  ▹_reset: function () {
  ▹add: function (models, options) {
  ▹all: function () {
  ▹any: function () {
  ▹at: function (index) {
  ▹bind: function (name, callback, context) {
  ▹chain: function () {
  ▹clone: function () {
  ▹collect: function () {
  ...

etc. etc. These are clearly not the defined model attributes.

What on earth is going on? This is supposed to be so simple. I must have missed something, but what? Why is Backbone not interpreting a proper JSON structure as model's attributes?

2

There are 2 best solutions below

1
On

take a look here - this should be interesting for you:

config.include_json_root = false

I suppose that you have to change this in your config and you should be good to go.

0
On

As always I spent the entire day trying to fix it and I find a fix after I post a question.

Okay, the problem was nowhere in the aforementioned parts of the application. In my asset pipeline I have included backbone_rails_sync.js which allows to wrap the attributes in a paramRoot, so that when you perform model.save() the parameters that go to rails controller look like this:

{"conference"=>{"title"=>"new conference", "category" => "super conferences"}, "action"=>"create", "controller"=>"conferences"}

instead of

{"title"=>"new conference", "category" => "super conferences", "action"=>"create", "controller"=>"conferences"}

And this particular sync patch completely threw me off.

solution:

After not much deliberation I replaced it with a different monkey patch. Everything works now and my params are still properly wrapped.