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
109203/3/1998 12:00:00 AMAROUTBrook Farm Stratford St. Mary
109213/3/1998 12:00:00 AMVAFFESmagsloget 45
109223/3/1998 12:00:00 AMHANARRua do Paço, 67
109233/3/1998 12:00:00 AMLAMAI1 rue Alsace-Lorraine
109243/4/1998 12:00:00 AMBERGSBerguvsvägen 8
109253/4/1998 12:00:00 AMHANARRua do Paço, 67
109263/4/1998 12:00:00 AMANATRAvda. de la Constitución 2222
109273/5/1998 12:00:00 AMLACOR67, avenue de l'Europe
109283/5/1998 12:00:00 AMGALEDRambla de Cataluña, 23
109293/5/1998 12:00:00 AMFRANKBerliner Platz 43
109303/6/1998 12:00:00 AMSUPRDBoulevard Tirou, 255
109313/6/1998 12:00:00 AMRICSUStarenweg 5
109323/6/1998 12:00:00 AMBONAP12, rue des Bouchers
109333/6/1998 12:00:00 AMISLATGarden House Crowther Way
109343/9/1998 12:00:00 AMLEHMSMagazinweg 7
109353/9/1998 12:00:00 AMWELLIRua do Mercado, 12
109363/9/1998 12:00:00 AMGREAL2732 Baker Blvd.
109373/10/1998 12:00:00 AMCACTUCerrito 333
109383/10/1998 12:00:00 AMQUICKTaucherstraße 10
109393/10/1998 12:00:00 AMMAGAAVia Ludovico il Moro 22

jQuery Ajax：

First  Prev  ...  4  5  6  7  8  9  10  11  12  13  ...  Next  Last  

MicrosoftAjax：

First  Prev  ...  4  5  6  7  8  9  10  11  12  13  ...  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);
            }
        }