BackboneJS model.url using collection.url

Question

From my understanding the default behavior of Backbone JS Models are to return the Collection's URL, unless the model has a urlRoot specified. I can't seem to get the behavior to work.

From the documentation:

model.url() ... Generates URLs of the form: "[collection.url]/[id]" by default, but you may override by specifying an explicit urlRoot if the model's collection shouldn't be taken into account.

Here is my collection, and model respectively:

var MyCollection = Backbone.Collection.extend({
    model: Model,
    initialize: function(options){
        this.options = options || {};
    },
    url: function(){
        return "/theurl/" + this.options.param;
    }
});
return MyCollection;

...

var MyModel = Backbone.Model.extend({
    urlRoot: '/theurl',
    initialize: function() {
    }
});
return MyModel;

When a model is loaded without a collection, it works great and submits to /theurl, but when it's loaded into a collection, all methods submit to /theurl/param/.

If I'm understanding the documentation correctly, the urlRoot of the Model should override this behavior; and even then the models url should be /theurl/param/{MODEL-ID}.

Any ideas on what I'm missing/misunderstanding?

...

PS: The model: Model from the collection is brought in via RequireJS

dcarson · Accepted Answer · 2013-07-04T04:23:00.413

9

It will always use the collection's url even if you have urlRoot specified.

The reason for urlRoot is so you can use it in an override, or if the model happens to not be in a collection ( for example maybe it gets removed, but still exists on the client).

So if you want to fetch or save the model and override the url generated by the collection you'll need to pass the urlRoot into these methods explicitly as an option. For example:

yourModel.save({ url: yourModel.urlRoot });

I agree the documentation is confusing and this caught me out recently too.

edited Jul 04 '13 at 04:23

answered Jul 04 '13 at 04:16

dcarson

2,853
1
25
34

Thanks for the answer. Documentation seems super ambiguous there. Any ideas on why it's not appending the Model ID to the end of the collection URL? – caleb Jul 04 '13 at 04:29
There are a few things. Have you just created the model on the client? If so it won't necessarily have an id as it has not been saved to the server yet. In this case it will only have a cId. – dcarson Jul 04 '13 at 04:50
2

I think this should instead say: `yourModel.save({}, { url: yourModel.urlRoot });`. The way it's currently written is going to `set` the `url` property on the object because the first argument to `save` is an attributes hash. – flyingL123 Nov 10 '15 at 20:54
yourModel.save({}, { url: yourModel.urlRoot }); worked! – Srikanth Jeeva Dec 07 '15 at 18:24

score 1 · Answer 2 · answered Jul 04 '13 at 07:43

1

UrlRoot should be a function and model must have attributeId defined. If you define your model like this all operation will be working if model is in collection or not.

Backbone add modelId at the end of URL that is returned by urlRoot function.

var MyModel = Backbone.Model.extend({
    attributeId: 'myModelId'
    urlRoot: function() {
        return '/theurl';
    },
    initialize: function() {
    }
    defaults: {
        myModelId: null
    }
});

answered Jul 04 '13 at 07:43

maketest

281
1
8

I just tested this by setting `urlRoot` as a function instead of a string and it did not use the model's `urlRoot` function when the model was in a collection and `save` was called on the model. – dcarson Jul 04 '13 at 08:33
if model is in collection then collection url is used. urlRoot is only when model is outside of collection. – maketest Jul 04 '13 at 08:41
Exactly! That behaviour was what the person asking the question was inquiring about as it was unexpected to him/her. The documentation is confusing and it suggests that setting `urlRoot` will mean the model **always** uses the urlRoot, even when its in a collection. As I said in my answer and you just said in your comment, this is not actually the case. – dcarson Jul 04 '13 at 08:47

score 0 · Answer 3 · edited Dec 10 '15 at 01:40

0

In the model, try using:

url: function() {
    return 'your url goes here';
}

edited Dec 10 '15 at 01:40

Marco Bonelli

63,369
21
118
128

answered Dec 10 '15 at 01:17

brownmamba

755
1
8
16

BackboneJS model.url using collection.url

3 Answers3

Linked