Ajax paging with MicrosoftAjax script library

Syntax:<%=Ajax.Pager(Model,"Paging",null, new PagerOptions{ShowDisabledPagerItems = false}, new AjaxOptions{ UpdateTargetId = "dvOrders" },null)%>
Order IDOrder DateCustomer IDShip Address
1076012/1/1997 12:00:00 AMMAISDRue Joseph-Bens 532
1076112/2/1997 12:00:00 AMRATTC2817 Milton Dr.
1076212/2/1997 12:00:00 AMFOLKOÅkergatan 24
1076312/3/1997 12:00:00 AMFOLIG184, chaussée de Tournai
1076412/3/1997 12:00:00 AMERNSHKirchgasse 6
1076512/4/1997 12:00:00 AMQUICKTaucherstraße 10
1076612/5/1997 12:00:00 AMOTTIKMehrheimerstr. 369
1076712/5/1997 12:00:00 AMSUPRDBoulevard Tirou, 255
1076812/8/1997 12:00:00 AMAROUTBrook Farm Stratford St. Mary
1076912/8/1997 12:00:00 AMVAFFESmagsloget 45
1077012/9/1997 12:00:00 AMHANARRua do Paço, 67
1077112/10/1997 12:00:00 AMERNSHKirchgasse 6
1077212/10/1997 12:00:00 AMLEHMSMagazinweg 7
1077312/11/1997 12:00:00 AMERNSHKirchgasse 6
1077412/11/1997 12:00:00 AMFOLKOÅkergatan 24
1077512/12/1997 12:00:00 AMTHECR55 Grizzly Peak Rd.
1077612/15/1997 12:00:00 AMERNSHKirchgasse 6
1077712/15/1997 12:00:00 AMGOURLAv. Brasil, 442
1077812/16/1997 12:00:00 AMBERGSBerguvsvägen 8
1077912/16/1997 12:00:00 AMMORGKHeerstr. 22

Ajax paging (only refresh part of page and url does not change):

1  2  3  4  5  6  7  8  9  10  ...  Next  Last

Standard url paging (refresh whole page and url changed)

1  2  3  4  5  6  7  8  9  10  ...  Next  Last
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" 
Inherits="System.Web.Mvc.ViewPage<PagedList<Order>>" %>
<%@ Import Namespace="Webdiyer.Mvc2Demo.Models"%>
<%@ Import Namespace="Webdiyer.WebControls.Mvc"%>
 
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Ajax paging with MicrosoftAjax 
</asp:Content>
 
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script language="javascript" type="text/javascript" 
src="<%=Url.Content("~/Scripts/MicrosoftAjax.js") %>"></script>
<script language="javascript" type="text/javascript" 
src="<%=Url.Content("~/Scripts/MicrosoftMvcAjax.js") %>"></script>
 
    <h2>Ajax paging with MicrosoftAjax script library</h2>
<%Html.RenderPartial("UCOrderList", Model); %>
</asp:Content>
<%@ Control Language="C#" 
Inherits="System.Web.Mvc.ViewUserControl<PagedList<Order>>" %>
<%@ Import Namespace="Webdiyer.Mvc2Demo.Models"%>
<%@ Import Namespace="Webdiyer.WebControls.Mvc"%>
<div id="dvOrders">
<table width="98%">
<tr><th>Order ID</th><th>Order Date</th><th>Customer ID</th>
<th>Ship Address</th></tr>
<%foreach(Order od in Model)
 {
     %>
     <tr><td><%=od.OrderID %></td><td><%=od.OrderDate.ToString() %></td>
     <td><%=od.CustomerID %></td><td><%=od.ShipAddress %></td></tr>
     <%
 } %>
</table>
<p>Ajax paging (only refresh part of page and url does not change):'a3?</p>
<%=Ajax.Pager(Model, new PagerOptions { PageIndexParameterName = "id", 
    ShowDisabledPagerItems = false, SeparatorHtml = "&nbsp;&nbsp;&nbsp;" }, 
    new AjaxOptions { UpdateTargetId = "dvOrders"})%>
<p>Standard url paging (refresh whole page and url changed)</p>
<%=Html.Pager(Model, new PagerOptions { PageIndexParameterName = "id", 
    ShowDisabledPagerItems = false, SeparatorHtml = "&nbsp;&nbsp;&nbsp;" })%>
</div>
        public ActionResult MsAjaxOrders(int? id)
        {
            using (var db = new MvcPagerDemoDataContext())
            {
                PagedList<Order> orders = db.Orders.ToPagedList(id ?? 1, 20);
                if (Request.IsAjaxRequest())
                    return PartialView("UCOrderList", orders);
                return View(orders);
            }
        }