Backbone how to construct json correctly

Question

I want to construct an app of hotel and rooms.
Every hotel can have more rooms, I retrieve this data from external server in XML, I parse it and now I have divided into two arrays: hotel and rooms like this:
hotel.json

[
  {
    "id": "1", 
    "name": "Hotel1"
  }, 
  {
    "id": "2", 
    "name": "Hotel2"
  }, 
  {
    "id": "3", 
    "name": "Hotel3"
  }
]

rooms.json

[
  {
    "id" : "r1",
    "hotel_id" : "1",
    "name" : "Singola",
    "level" : "1"
  },
  {
    "id" : "r1_1",
    "hotel_id" : "1",
    "name" : "Doppia",
    "level" : "2"
  },
  {
    "id" : "r1_3",
    "hotel_id" : "1",
    "name" : "Doppia Uso singol",
    "level" : "1"
  },
  {
    "id" : "r2",
    "hotel_id" : "2",
    "name" : "Singola",
    "level" : "1"
  },
  {
    "id" : "r2_1",
    "hotel_id" : "2",
    "name" : "Tripla",
    "level" : "1"
  }
]

Into my backbone app I have to make some controller and some parse to retrieve rooms for its hotel.
I want to know if is better for backbone to construct a Json like that:

[
      {
        "id": "1", 
        "name": "Hotel1",
        "rooms": [
                 {
                   "id" : "r1",
                   "hotel_id" : "1",
                   "name" : "Singola",
                   "level" : "1"
                 },
                 {
                   "id" : "r1_1",
                   "hotel_id" : "1",
                   "name" : "Doppia",
                   "level" : "2"
                 }
                 ]

      }, 
      {
        "id": "2", 
        "name": "Hotel2",
        "rooms": [
                 {
                   "id" : "r2",
                   "hotel_id" : "2",
                   "name" : "Singola",
                   "level" : "1"
                 },
                 {
                   "id" : "r2_1",
                   "hotel_id" : "1",
                   "name" : "Doppia",
                   "level" : "2"
                 }
                 ]
      }, 
      {
        "id": "3", 
        "name": "Hotel3"
      }
    ]

Which is the better mode for backbone in terms of efficiency and parsing? I thinked the first case but after construct the app I'm not sure.

also interested, because being new to backbone I ended up having separated collections only because I could listen for event on them early, from views, and not depending on construction of other models.. — DRC, Jul 02 '13 at 19:58

Brian Lewis · Accepted Answer · 2013-07-02T20:52:01.407

1

I would recommend keeping the data structures flat, as Backbone doesn't really support nested collections without some extra effort. Keeping the data model flat will also make it easier for you to map to REST endpoints (ie. '/hotels/1/rooms', 'rooms/1', etc.).

Just to demonstrate the complexities, here is an example of how one would have to associate a collection to a model:

HotelModel = Backbone.Model.extend({
    initialize: function() {
        // because initialize is called after parse
        _.defaults(this, {
            rooms: new RoomCollection
        });
    },
    parse: function(response) {
        if (_.has(response, "rooms")) {
            this.rooms = new RoomCollection(response.rooms, {
                parse: true
            });
            delete response.rooms;
        }
        return response;
    },
    toJSON: function() {
        var json = _.clone(this.attributes);
        json.rooms = this.rooms.toJSON();
        return json;
    }
});

With a flat data structure, you could do something like this:

HotelModel = Backbone.Model.extend({
    idAttribute:'hotel_id',
    urlRoot:'/hotels'
});
RoomModel = Backbone.Model.extend({
    idAttribute:'room_id',
    urlRoot:'/rooms'
});

HotelCollection = Backbone.Collection.extend({
    url: '/hotels',
    model:HotelModel
});
RoomCollection = Backbone.Collection.extend({
    url: '/rooms',
    model:RoomModel,
    getByHotelId: function(hotelId){
        return this.findWhere({hotel_id:hotelId});
    }
});

edited Jul 02 '13 at 20:52

answered Jul 02 '13 at 20:00

Brian Lewis

5,739
1
21
28

the problem is more extended if you see this question that I cant go out is the second part of my problem. http://stackoverflow.com/questions/17417589/recursive-function-jquery-with-backbone – Alessandro Minoccheri Jul 02 '13 at 20:19
But your question is great to start to parse data, and I follow you to mantain separate my json tohave flat array. +1 for the great answer – Alessandro Minoccheri Jul 02 '13 at 20:20
Glad I could help. I'm not sure I understand, "can't go out" though. – Brian Lewis Jul 02 '13 at 20:23
is possible to combine the problem that I have linked into my first comment to this answer it would be great! if you wanna answer to the other question with this and implement a solution for my combination I accepted it because is very complex for me. can you help me? – Alessandro Minoccheri Jul 02 '13 at 20:24
with can't go out I mean that the problem get me crazy :) – Alessandro Minoccheri Jul 02 '13 at 20:30
Because I have understand your answer but the most problem is how to combinate rooms. because foreach hotel i want to create combination of its rooms, each combinaton musta have one room of level 1 one room of level2 and one room of level3 this gonna be me crazy.. – Alessandro Minoccheri Jul 02 '13 at 20:41
@moderndegree if the model key is different from `id`, shoudn't you specify idAttribute: 'hotel_id' in the model instead? – DRC Jul 02 '13 at 20:44

Backbone how to construct json correctly

1 Answers1

Linked