Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Backbone set collection attribute (for the url)

I need to pass an id to a collection for use in the url (e.g. /user/1234/projects.json) but am not sure how to do this, an example would be wonderful.

The way my application is structured is on launch a collection of 'users' is pulled and rendered, I then want when a user is clicked their 'documents' are pulled from the server into a new collection and rendered in a new view. The issue is getting the user id into the documents collection to give the relevant URL for the documents.fetch().


think I've got it, here is an example:

  //in the the view initialize function     
  this.collection = new Docs();
  this.collection.project_id = this.options.project_id;
  this.collection.fetch();

  //in the collection
  url: function() {
     return '/project/api/' +this.project_id+'/docs';
  }
like image 819
henry.oswald Avatar asked Jul 18 '11 14:07

henry.oswald


2 Answers

Your user collection url should be set to /user. Once that's set, your models should utilize that url in order to do their magic. I believe (not completely positive) that if a model is in a collection, calling the 'url' method will return /user/:id. So all your typical REST-ish functionality will be utilized on '/user/:id'. If you are trying to do something with a relationship (a user has many documents) it's kind of rinse and repeat. So, for your documents collection (which belogs to user correct?) you'd set the url to 'user_instance.url/documents'.

To show a one to many relationship with a backbone model, you'd do something like this (upgrade to backbone 0.5.1 for urlRoot):

var User = Backbone.Model.extend({
    initialize: function() {
        // note, you are passing the function url.  This is important if you are
        // creating a new user that's not been sync'd to the server yet.  If you
        // did something like: {user_url: this.url()} it wouldn't contain the id
        // yet... and any sync through docs would fail... even if you sync'd the
        // user model!
        this.docs = new Docs([], {user_url: this.url});
    },
    urlRoot: '/user'
});

var Doc  = Backbone.Model.extend();

var Docs = Backbone.Collection.extend({
    initialize: function(models, args) {
        this.url = function() { args.user_url() + '/documents'; };
    }
});

var user = new User([{id: 1234}]);
user.docs.fetch({ success: function() { alert('win') });
like image 100
Craig Monson Avatar answered Nov 16 '22 20:11

Craig Monson


Why do you need to override the URL property of the collection with a function?.. you could do:

 this.collection = new Docs();
 this.collection.project_id = this.options.project_id;
 this.collection.url = '/project/api/' + this.options.project_id + '/docs';
 this.collection.fetch();
like image 33
Duncan_m Avatar answered Nov 16 '22 22:11

Duncan_m