How to build a Collection/Model from nested JSON with Backbone.js

Question

I'm relativly new to Backbone.js

I have a JSON like the picture shows ! I saw some Answers in relation with Backbone-relational, but still dont get the point!

How can i convert this JSON to Backbone.js Collections/Models??

I update with a code but it dont work like expected! i can't see an model when i do :

My Structure is :

[0] : is a collection of models

[clefs] + ... + [Rest] : are collection of models

(clefs) => [0] + ... + [9] : are Models(title contains a string, path too)

Thanks a lot!!

EDIT(10.01.12) :

My Solution :

window.initModel = Backbone.Model.extend({
  defaults: {
    "title": "",
    "path": ""
  }
});
window.CustomCollection = Backbone.Collection.extend({
  model: initModel
});
window.Init = Backbone.Model.extend({
  url : function(){
    return  "/api/data.json"      
  },

  parse: function(response) {

    clefs = new CustomCollection();
    clefs.add(response.clefs);        
    this.set({clefs: clefs});

    .....

    rests = new CustomCollection();
    rests.add(response.rests);        
    this.set({rests: rests});
} 
});

this helped me out too!

Answer 1

I'm at work, so I cannot give you a fully coded answer, but the gist is, you can do the following in your top level models to achieve a nested model hierarchy:

var AmericasNextTopModel = Backbone.Models.extend({
    initialize: function(){

        this.set({
             clefs: new ClefCollection(this.get('clefs')),
             accidentals: new AccidentalCollection(this.get('accidentals')),
             notes: new NoteCollection(this.get('notes')),
             rests: new RestCollection(this.get('rests'))
        });
    }
});

I do not use backbone-relational so I cannot give you an answer regarding that.

Are you making an online sheet music viewer/editor? :D Cool I'd love to see it when you're done.

Answer 2

The reset method (see 'reset') allows you to pass a JSON array to a collection. This is the equivalent of a PUT method, replacing the specified collection with the JSON hash.

You can also use the add method to add to an existing collection, or pass the JSON hash into the constructor as you create a new collection.

You'll have to do some basic cleaning up of your array to get it in an appropriate format, and then convert it to JSON

Answer 3

I'm using PHP to grab a feed as JSON since it's on a different domain. I save those results to a JS variable, and then I just had success using this to get it into my Backbone collection...

var feedCollection = new Backbone.Collection();
feedCollection.set(myFeedJSON.nestedObject.nestedArrayIWant);