ASP.NET + jQuery + Odata = Goodness Stephen Walther Superexpert.com
Agenda Overview of OData/WCF Data Services Querying OData from jQuery Creating/Editing OData from jQuery Client/Server Validation Useful OData plugins
The Open Data Protocol (OData) Defined at Odata.org: ● Open Standard ● REST = Representational State Transfer ● Supports XML (Atom) and JSON ● XHR and JSONP
OData Data Sources Netflix NuGet Stack Overflow SQL Azure Azure Table Storage SharePoint 2010 Windows Live SQL Server Reporting Services eBay
WCF Data Services Exposes data using the OData protocol WCF Data Services February 2011 CTP2 ● Works with Entity Framework 4.1 (Code First)
WCF Data Services Exposes DBContext:
Querying OData OData URIs have three parts: ● Service Root ● Resource Path ● Query Options
Querying OData Query Options: ● $select ● $filter ● $top ● $skip ● $orderby ● $inlinecount ● $count $expand $format $links $metadata $value
Query OData (Operators)
Query OData (String Filters)
Query OData (Date Filters)
Query OData (Math Filters)
Query OData (Type Filters)
Query OData __metadata:
Query OData with jQuery
Create New Entities
Edit Existing Entities
Validation Client = Use jQuery Validate Use for immediate user feedback Server = Use Entity Framework Use for domain validation
Client Validation Use jQuery Validate to create client validation rules
Server Validation Use Data Annotation validators to validate properties:
Server Validation Use the IValidatableObject interface for more complex validation:
Server Validation Handle the Entity Framework DbEntityValidationException in your service class:
jQuery OData Plugin Created by Egil Hansen: ● Updated fork at: ●
DataJS Plugin Created by Microsoft: ● Supports reading and updating data Supports HTML5 DOM Storage
Resources ● WCF Data Services March 2011 CTP b392-6b04cdc821behttp:// b392-6b04cdc821be ● Entity Framework 4.1 (Included with MVC3) 48b2-878d-b9f49d87569ahttp:// 48b2-878d-b9f49d87569a ● jQuery Templates Install-Package jQuery.Templates ● jQuery UI (Included with MVC3) Install-Package jQuery.UI ● jQuery Odata ● DataJS
Download the Sample Code Visit Stephen Walther’s blog to download the sample code for this talk: ●
Website: Phone:
Your Feedback is Important Please fill out a session evaluation form. Thank you!