ASP.NET MVC中使用MvcPager异步分页+在分页中复…

public class Article
    {
        [Display(Name = "文章编号")]
        public int ID { get; set; }
        [Display(Name = "文章标题")]
        [MaxLength(200)]
        public string Title { get; set; }
        [Display(Name = "文章内容")]
        public string Content { get; set; }
        [Display(Name = "发布日期")]
        public DateTime PubDate { get; set; }
        [Display(Name = "作者")]
        [MaxLength(20)]
        public string Author { get; set; }
        [Display(Name = "文章来源")]
        [MaxLength(20)]
        public string Source { get; set; }
    }

 public ActionResult AjaxPaging(int id = 1)
        {
            using (var db = new DataContext())
            {
                var model = db.Articles.OrderByDescending(a => a.PubDate).ToPagedList(id, 5);
　　　　　　　　　　//判断是否是AJAX请求,如果为true,就返回分部视图
                if (Request.IsAjaxRequest())
                    return PartialView("_ArticleTable", model);
                return View(model);
            }
        }

@model PagedList<MVCPager_Text.Models.Article>
@using Webdiyer.WebControls.Mvc;

//这个ID就是我们在分页需要来更新的ID
<div id="articles">
    @Html.Partial("_ArticleTable", Model)
</div>
@section scripts
{
    @{Html.RegisterMvcPagerScriptResource();}
　　　//这句话是必须的,用来注册MVCPager,如果没有可能造成Ajax请求无反应
}

@model PagedList<MVCPager_Text.Models.Article>
@using Webdiyer.WebControls.Mvc;
<table class="table table-bordered table-striped">
    <tr>
        <th class="nowrap">序号</th>
        <th>
            @Html.DisplayNameFor(model => model.Title)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.PubDate)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Author)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Source)
        </th>
    </tr>
    @{ int i = 0;}
    @foreach (var item in Model)
    {
        <tr>
            <td>@(Model.StartItemIndex + i++)</td>
            <td>
                @Html.DisplayFor(modelItem => item.Title)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.PubDate)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Author)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Source)
            </td>
        </tr>
    }
</table>
<div class="text-center">
    @Ajax.Pager(Model, new PagerOptions { PageIndexParameterName = "id", ContainerTagName = "ul", CssClass = "pagination", CurrentPagerItemTemplate = "<li class=\"active\"><a href=\"#\">{0}</a></li>", DisabledPagerItemTemplate = "<li class=\"disabled\"><a>{0}</a></li>", PagerItemTemplate = "<li>{0}</li>" }).AjaxOptions(a => a.SetUpdateTargetId("articles"))
</div>

    @Ajax.Pager(Model, new PagerOptions {
    PageIndexParameterName = "id",
    NumericPagerItemCount = 5,
    CssClass = "pagination",
    CurrentPagerItemTemplate = "<li class=\"active\"><a href=\"#\">{0}</a></li>",
    DisabledPagerItemTemplate = "<li class=\"disabled\"><a>{0}</a></li>",
    PagerItemTemplate = "<li>{0}</li>", Id = "bootstrappager"
},new MvcAjaxOptions { OnBegin= "GetCheckbox()",OnSuccess= "OnSuccess" } ).AjaxOptions(a => a.SetUpdateTargetId("RecordList").SetDataFormId("searchForm"))

//定义一个数组来存储,选中的ID
var select = new Array; 

function GetCheckbox() {
　　　　　　//.single是复选框的class
        $(".single").each(function () {
　　　　　　　　//判断复选框的状态,如果选中为true
            if ($(this).prop('checked')) {
　　　　　　　　　　//判断选中的复选框的val()值是否存在在该数组中select
                var index = $.inArray($(this).val(), select);
　　　　　　　　　　//不存在则会返回-1,不存在向数组中写入
                if (index == -1) {
                    select.push($(this).val())
                }
            }  
            else {
　　　　　　　　　　//如果没有选中,有可能会取消选中,我们要判断当前的页面没有选中的$(this).val()值是否在数组中select
                var index = $.inArray($(this).val(), select);
　　　　　　　　　　//如果存在则会返回存在数值在数组中的下标
                if (index >= 0) {
                    //删除该下标的值
                    select.splice(index);
                }
            }
        })
    }

function OnSuccess() {
        $(".single").each(function () {
　　　　　　　　//当更新成功之后,我们需要判断当前页面的复选框的$(this).val()是否存在于数组中select
            var index = $.inArray($(this).val(), select)
　　　　　　　　//存在则返回下标
            if (index >= 0) {
               // console.log("index=" + index + ",select[Index]=" + select[index])
　　　　　　　　　　
　　　　　　　　　　如果$(this).val()的值与数组中下标的值相同,则给它处于选中状态
                if ($(this).val() == select[index]) {
                    $(this).prop('checked', 'checked');
                }
            }
        })
    }