Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Backbone JS Models and Collection URLs

Tags:

backbone.js

If I have a model named "Book" and a collection named "Library" defined as below:

Book

app.Book = Backbone.Model.extend({     defaults: {         title: 'No title',         author: 'Unknown'     } }); 

Library

app.Library = Backbone.Collection.extend({     model: app.Book,     url: '/api/books' }); 

When I call BookInstance.save() how does it come up with the URL to use? Does it derive it from the collection?

In Backbone.model there are 2 options: url and urlRoot. What is the purpose and difference between these?

In Backbone.collection, there is a single parameter url. Is this always the GET request for the RESTFUL api?

like image 600
Chris Muench Avatar asked May 31 '13 16:05

Chris Muench


People also ask

Is Backbone JS still relevant?

Backbone. Backbone has been around for a long time, but it's still under steady and regular development. It's a good choice if you want a flexible JavaScript framework with a simple model for representing data and getting it into views.

What is backbone JS model?

Model contains dynamic data and its logic. It performs various types of action on the data like validation, conversion, computed properties, access control etc. 1. It extends Backbone.

Is backbone a MVC?

Backbone is a JavaScript MVC library and that's a key difference. In the JavaScript MVC context, a framework usually means that you need to configure your code to get things done.


2 Answers

Basically, there are 3 possibilities to construct a model's url:

  • If the model object exists in a collection then its url method will return an address composed of the collection.url and model.id: [collection.url]/[id].

  • If you don't want to use a model inside the collection, then model.urlRoot's value can be used instead of the collection.url fragment, resulting in the following pattern: [urlRoot]/[id].

  • Finally, if you're NOT planning to persist more that one model of a given type to the server or will be defining URLs for each model upon their creation, you can directly assign a value to model.url.

Collections send only GET requests — to get an array of models' JSON data. For saving, removing, and updating, the individual model's save() (POST/PUT/PATCH) and destroy() (DELETE) methods are used.

Here's the source code of Backbone.Model.url, which should help you:

url: function() {   var base =     _.result(this, 'urlRoot') ||     _.result(this.collection, 'url') ||     urlError();   if (this.isNew()) return base;   var id = this.get(this.idAttribute);   return base.replace(/[^\/]$/, '$&/') + encodeURIComponent(id); } 
like image 148
mirrormx Avatar answered Nov 21 '22 17:11

mirrormx


In model

  1. urlRoot is used for the Model.
  2. url is used for the instance of the Model.

So if urlRoot exists then book.fetch() will fetch the data given id, for example

var Book = Backbone.Model.extend({urlRoot: 'books' }); var book = new Book({id: 1}); book.fetch();  // will get /books/1  var Book = Backbone.Model.extend({}); var book = new Book({url: 'books/1'}); book.fetch();  // will get /books/1   var Books = Backbone.Collection.extend({model: Book}); var books = new Books({ /*....*/ }); books.fetch(); // will get /books/  

You can refer the backbone Model urlRoot source code here

I hope it makes sense to you, good luck.

like image 43
Alan Dong Avatar answered Nov 21 '22 15:11

Alan Dong