JayData.org

How to use JayData with ASP.NET Web API – I

Author: Peter Aron Zentai December 10th, 2012


ASP.NET Web API vs OData

With the 1.2.6 release, JayData provides an ASP.NET Web API specific data provider to let you connect not only to OData enabled endpoints but simple ASP.NET Web API backed REST services too. Out of the box the ASP.NET Web API supports a truly REST approach for dealing with data and borrows some concepts from OData standard mainly on the query aspect of data. It’s important to note that ASP.NET Web API by default is not OData! It’s a much simpler thing for a list of simple use cases.

Our philosophy regarding our approach to support ASP.NET Web API was that the default controller templates, generated by the Visual Studio “Add controller” wizard should work WITHOUT any further ado. No additional server components and dll, no custom controller filters, no custom metadata services. This though keeping our server code simple definitely limits the capabilities of our endpoint on a way not all projects can accept. Read the list of limitations here. For those finding the basic Web API features insufficient the ultimate solution is to extend your project to support standard OData. This became increasingly easy and also powerful with the Microsoft ASP.NET Fall Update preview that arrived recently. An upcoming post will show you how to upgrade your simple Web API project into an OData V3 compliant solution.

Create the Todos Controller

Let’s start off with an ASP.NET Web API project with a simple Todo database in it. We use Entity Framework and SQL CE 4.0 to define a simple Todo entity and also to build up the database. Read this post for a step-by-step guide on creating the Todo test project.

image

Now right click on the Controllers folder and select Add Controller. Set “TodosController” as the controller name. Select the “API controller with read/write actions, using Entity Framework” as the scaffold template. For Model class select Todo and TodoModelContainer for data context class.

image

To test your controller launch your project with F5 and navigate to http://yoursite/api/todos . Depending on your Web API version you should see an XML feed or a JSON document with your Todo items listed.

Use the JayData ItemStore API with the webApiProvider

We will test drive our Web API based REST service from a single HTML5 page. In a real world scenario you would build these into MVC Views – but for the sake of simplicity let’s just have this code in a simple html file. So just add an html page to your MVC project, and call it application.html

Setup client

Scripts to include

Define the Todo type on the client

The ASP.NET Web API provider does not use server generated metadata to setup the client. You need to provide the JayData library with some information about the data types your about to deal with. This at the moment you can only do manually. Version 1.2.7 of JayData brings Visual Studio development time support for autogenerating the client environment.

 

GET /api/Todos

List all Todo items.

Press F12 on most browsers to open up your console where the output is placed.

The result:

image

GET /api/Todos with filtering

To support server side filtering/querying for items, you have to modify your Controller code a bit.

Server code:

Before After

Client code:

 

GET /api/Todos/id

Todo.read

POST /api/Todos

To create a new item, use the save() method.

PUT /api/Todos/id

To update items use the save() method on an instance.

todo.Completed = true; return todo.save();

DELETE /api/Todos/id

Alternatively: