Use odata in ASP. NET mvc3

1. Create an Asp.net mvc3 Application Project
2. Add service reference
   
3. Enter address: http://services.odata.org/Northwind/Northwind.svc/ go to and add the northwindservice namespace
   
4. New Controller
   
5. Compile by F6
6. Add a strong-type branch view productlist
   
7. Replace views/product/productlist. cshtml code
   View code

   @model IEnumerable<ODataMvcApplication.NorthwindService.Product><table>    <tr>        <th>            ProductName        </th>        <th>            SupplierID        </th>        <th>            CategoryID        </th>        <th>            QuantityPerUnit        </th>        <th>            UnitPrice        </th>        <th>            UnitsInStock        </th>        <th>            UnitsOnOrder        </th>        <th>            ReorderLevel        </th>        <th>            Discontinued        </th>    </tr>@foreach (var item in Model) {    <tr>        <td>            @Html.DisplayFor(modelItem => item.ProductName)        </td>        <td>            @Html.DisplayFor(modelItem => item.SupplierID)        </td>        <td>            @Html.DisplayFor(modelItem => item.CategoryID)        </td>        <td>            @Html.DisplayFor(modelItem => item.QuantityPerUnit)        </td>        <td>            @Html.DisplayFor(modelItem => item.UnitPrice)        </td>        <td>            @Html.DisplayFor(modelItem => item.UnitsInStock)        </td>        <td>            @Html.DisplayFor(modelItem => item.UnitsOnOrder)        </td>        <td>            @Html.DisplayFor(modelItem => item.ReorderLevel)        </td>        <td>            @Html.DisplayFor(modelItem => item.Discontinued)        </td>    </tr>}</table>

    

8. Replace controllers/productcontroller. CS Code view code

   using ODataMvcApplication.NorthwindService;using System;using System.Collections.Generic;using System.Linq;using System.Web;using System.Web.Mvc;namespace ODataMvcApplication.Controllers{    public class ProductController : Controller    {        public ActionResult Index()        {            return View();        }        public PartialViewResult Products(int id)        {            var context = new NorthwindEntities(new Uri("http://services.odata.org/Northwind/Northwind.svc/"));            var products = from product in context.Products where product.CategoryID == id select product; return PartialView("ProductList", products.ToList());        }        static public List<Category> Categories() { var context = new NorthwindEntities(new Uri("http://services.odata.org/Northwind/Northwind.svc/")); return context.Categories.ToList(); }    }}

    

9. Add index View
   
10. Replace view/product/index. cshtml Code view code

    @ {Layout = NULL;} <SCRIPT src = "@ URL. Content ("~ /Scripts/jquery-1.7.1.min.js ")"> </SCRIPT> <SCRIPT src = "@ URL. Content ("~ /Scripts/jquery. unobtrusive-ajax.js ")" type = "text/JavaScript"> </SCRIPT> <SCRIPT type = "text/JavaScript"> $ (document ). ready (function () {$ ("# category "). change (function () {loadview ($ (this ). val () ;}); loadview ("1") ;}); function loadview (CAT) {$ ("# Content" loading .html ("loading .... "); $. Get ('@ URL. routeurl ("default", new {controller = "product", Action = "Products"}) ', {ID: CAT}, function (data) {$ ("# Content" pai.html (data) ;}</SCRIPT> <div> 
     

11. Preview Effect