CodesJava

Easy learning with example program codes

Backbone.JS Router Extend()

The Backbone.JS Router Extend() method extends the backbone’s router class. It also creates a new constructor and defines some triggered actions.

Syntax:

Backbone.Router.extend (properties, classProperties)   

Parameters:
properties: This parameter is used to specify the properties for instance for the router class.
classProperties: This parameter is used to specify the class properties for the constructor function of the router.

Example:

<!DOCTYPE html>  
<html>
<head>  
<title>Example</title>  
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" 
type="text/javascript"></script>  
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" 
type="text/javascript"></script>  
<script type="text/javascript">  
var routeList = Backbone.View.extend({  
el: '#routelist',  
events: {  
'click a' : 'onClick'  
},  
onClick: function( e ) {  
router.navigate('/');  
}  });  
var X = Backbone.Router.extend({  
routes: {  
'route/:id' : 'defaultRoute'  
},  });  
var routelist = new routeList();  
Backbone.history.start();  
</script>  
</head>  
<body>  
<section id="routelist">  
<ul>  
<li> <a href="#/route1">Route 1 </a> </li>  
<li> <a href="#/route2">Route 2 </a> </li>  
<li> <a href="#/route3">Route 3 </a> </li> 
<li> <a href="#/route4">Route 4 </a> </li> 
<li> <a href="#/route5">Route 5 </a> </li> 
</ul>  
</section>  
</body>  
</html>

Output:

●	Route 1
●	Route 2
●	Route 3
●	Route 4
●	Route 5

Explanation:
In the above example the Extend() method is used to extend the backbone’s router class.

Please follow and like us:
error









Copyright © 2019 CodesJava DMCA.com Protection Status