Gullele's Corner

Constructing Dynamic URL in backboneJS Tutorial with Example

Working on Backbone js and wanted to pass the url dynamically?

Say you want to fetch the data based on the url

url: someurl/{dynamic-value}/content/{dynamic-value}

Here are some steps to accomplish constructing backboneJS url dynamically based on runtime values.

How to select element with multiple class

Solution

Lets assume your collection looks like this

var Members=Backbone.Collection.extend({
	url: function(){
		return url+'attendees/'+this.options.group;
	},
	initialize: function(models, options){
		this.options=options;
	}
});

On the above example your dynamic url might look like
http://somethingsomething.com/attendees/presenters – where presenters is something you added dynamically

and on your view

var Attendees=Backbone.View.extend({
	el: 'YOUR VIEW',
	render: function(){
		var view=this;
		var member=new Members([], {group: 'presenters'});
		member.fetch({
			success: function(members){
				var template= ...YOUR STUFF GOES HERE
		});
	},
	events: {
		'click #activities': 'membersByActivity'
	},
	membersByActivity: function(){
                YOUR LOGIC..
		return false;
	}
});

The important part for creating dynamic url in backbone js is:

var member=new Members([], {group: 'presenters'});

where you can change the presenters part as you like dynamically