Posts

Showing posts from December, 2012

Creating MVC RESTful API with Backbone.js - Part 3

This is the last part of the series for creating MVC RESTful API with Backbone.js. In previous two posts I have: Created MVC RESTful API Created Backbone model, collection and views In this part, I will be rendering the client-side backbone views on server-side razor view pages. I have two razor views: Index.cshtml and Details.cshtml . In Index.cshtml I will be rendering the  ProductListView (backbone view) that I created before. Here is how to render this: Here at the very beginning I am initializing the Products collection and then fetching collection data. The fetch method will cause to send a GET request to the specified URL of the collection. I am initializing and rendering ProductListView inside success callback of collection fetch method so that the view is rendered after the collection data is ready. The "el" attribute of the view indicates the root DOM element of this view. Similarly ProductView is rendered at Details.cshtml : Here I...

Creating MVC RESTful API with Backbone.js - Part 2

Image
At this part I will be writing Backbone stuffs to communicate with the server using the API that I created at my previous post . For client side along with Backbone , I will be using JQuery and Underscore.js since Backbone has hard dependency on this and also Underscore provides a lot of the functional programming support. First let's take a look on the folder structure that I would like to have: Here I have separate folders inside Script folder for containing client-side model , collection and views . Model I have a script under model folder named Product.js that represents a backbone mode. Here is how it looks like: Here I have created a backbone model named Product . Backbone keeps trace of the models by it's id attribute. At server-side product model class, we had an attribute named PropertyId . At the second line, I am setting to count PropertyId as the identifier of the model. This client-side model will fetch product data from server using the ...

Creating MVC RESTful API with Backbone.js - Part 1

Image
Web applications that are being developed now-a-days are highly interactive and deserve a lot of client side scripting. JQuery helps but writing an application solely with JQuery may create a javascript spaghetti with selectors and callbacks. Backbone.js gives structure to web applications by providing models with key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing API over a RESTful JSON interface. ASP.NET MVC 3 already facilitates creating RESTful API and because Backbone.js enforces communication to the server through RESTful interface, it's quite easy to blend these server-side and client-side frameworks together. In this series of blogs, I will try to elaborate how to do that in a very simple way. For integrating MVC with Backbone.js, we will be: ...