Tag Archives: router

Backbone – Router

On this post create 2 template,and use backbone router to communicate with those 2 pages, here is the code.

<script type=”text/template” id=”first_template”>
<label>My First View:</label>
<a href=”#second”>Go to Second View</a>

</script>

<script type=”text/template” id=”second_template”>
<label>My Second View:</label>
<a href=”#first”>Go to First View</a>

</script>

<div id = “container”></div>

<script type=”text/javascript”>
FirstView = Backbone.View.extend({
el:$(‘#container’),
initialize:function(){
this.render();
},

render:function(){
var template = _.template($(‘#first_template’).html(),{});

this.$el.html(template);

}

});

SecondView = Backbone.View.extend({
el:$(‘#container’),
initialize:function(){
this.render();
},

render:function(){
var template = _.template($(‘#second_template’).html(),{});

this.$el.html(template);

}

});

MyRouter = Backbone.Router.extend({
routes:{
“”:”firstPage”,
“first”:”firstPage”,
“second”:”secondPage”
},

firstPage:function(){
new FirstView();
},
secondPage:function(){
new SecondView();
}

});

var router = new MyRouter();
Backbone.history.start();

</script>

 

Advertisements