MvcPager samples - Ajax events

This sample demonstrate how to handle Ajax events when implement Ajax paging, click or select page 10 will trigger server exception and fire the client OnFailure Ajax event.
Please note: AjaxOptions.OnSuccess property is not implemented when using jQuery Ajax

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

jQuery Ajax：

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

MicrosoftAjax：

First  Prev  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">
    MvcPager samples - Ajax events
</asp:Content>
 
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script language="javascript" type="text/javascript" 
src="<%=Url.Content("~/Scripts/jquery-1.4.2.min.js") %>"></script>
<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>MvcPager samples - Ajax events</h2>
    <div>This sample demonstrate how to handle Ajax events when implement Ajax paging, 
    click or select page 10 will trigger server exception and fire the client OnFailure Ajax event.
    <br /><span style="color:red">Please note: 
    AjaxOptions.OnSuccess property is not implemented when using jQuery Ajax</span>
    </div><br />
<%Html.RenderPartial("UCAjaxEvents", Model); %>
</asp:Content>
<%@ Control Language="C#" 
Inherits="System.Web.Mvc.ViewUserControl<PagedList<Webdiyer.Mvc2Demo.Models.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>jQuery Ajax：</p>
<%=Html.AjaxPager(Model, new PagerOptions() { PageIndexParameterName = "id", 
    ShowPageIndexBox = true, PageIndexBoxType = PageIndexBoxType.DropDownList, 
    ShowGoButton = false }, new AjaxOptions() { UpdateTargetId = "dvOrders", 
        OnBegin = "function(){alert('Ajax OnBegin event fired');}", 
        OnComplete = "function(){alert('Ajax OnComplete event fired');}", 
        OnFailure = "function(){alert('Ajax OnFailure event fired');}" })%>
<p>MicrosoftAjax：</p>
<%=Ajax.Pager(Model, new PagerOptions() { PageIndexParameterName = "id", 
    ShowPageIndexBox = true, PageIndexBoxType = PageIndexBoxType.DropDownList, 
    ShowGoButton = false }, new AjaxOptions() { UpdateTargetId = "dvOrders", 
        OnBegin = "function(){alert('Ajax OnBegin event fired');}", 
        OnComplete = "function(){alert('Ajax OnComplete event fired');}", 
        OnSuccess = "function(){alert('Ajax OnSuccess event fired');}", 
        OnFailure = "function(){alert('Ajax OnFailure event fired');}" })%>
</div>
        public ActionResult AjaxEvents(int? id)
        {
            using (var db = new MvcPagerDemoDataContext())
            {
                if (id.HasValue && id.Value == 10) //throw exception for testing purpose
                    throw new Exception("test exception");
                PagedList<Order> orders = db.Orders.ToPagedList(id ?? 1, 20);
                if (Request.IsAjaxRequest())
                    return PartialView("UCAjaxEvents", orders);
                return View(orders);
            }
        }