MvcPager在Ajax分页模式下，默认使用GET方式向服务器端提交数据，因此无需设置MvcAjaxOptions的HttpMethod属性，只需要设置DataFormId为要提交的表单的ID即可。 用户点击提交按钮进行查询时，MvcPager会将查询条件保存在客户端脚本变量中，每次分页时自动将该查询条件发送回服务器端，开发人员只需实现服务器端查询功能，无需编写任何客户端代码。
本示例使用Unobtrusive Ajax Form，因此需引入jquery.unobtrusive-ajax脚本库。
@model PagedList<article>
<fieldset><legend>查询</legend>
@using (Ajax.BeginForm("AjaxSearchGet", new RouteValueDictionary { { "id", "" } }, new AjaxOptions { UpdateTargetId = "articles",HttpMethod = "Get",InsertionMode = InsertionMode.Replace }, new RouteValueDictionary { { "id", "searchForm" } }))
{
<span>标题：</span><input type="text" name="title" id="title" style="width:120px" />
<span>作者：</span><input type="text" name="author" id="author" style="width:120px" /><span>（如：Webdiyer）</span>
<span>来源：</span><input type="text" name="source" id="source" style="width:120px" /><span>（如：吴起热线）</span>
<input type="submit" value="搜索(S)" accesskey="S" />
}</fieldset>
<div id="articles">
@Html.Partial("_AjaxSearchGet",Model)
</div>
@section Scripts
{@{Html.RegisterMvcPagerScriptResource();}
<script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>}
@model PagedList<article>
<div class="well well-sm">当前查询条件：标题：<span class="emph">@Request.QueryString["title"]</span> 作者：<span class="emph">@Request.QueryString["author"]</span> 来源：<span class="emph">@Request.QueryString["source"]</span></div>
@Html.Partial("_ArticleTable", Model)
<div><div style="float:left;width:50%">共 @Model.TotalPageCount 页 @Model.TotalItemCount 条记录，当前为第 @Model.CurrentPageIndex 页</div>
@Ajax.Pager(Model).Options(o=>o.SetPageIndexParameterName("id").AddHtmlAttribute("style","float:right").SetPagerItemTemplate(" {0}")).AjaxOptions(a=>a.SetUpdateTargetId("articles").SetDataFormId("searchForm"))
</div>
@model PagedList<Article>
<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>
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 AjaxSearchGet(string title, string author, string source, int id = 1)
{
return ajaxSearchGetResult(title, author, source, id);
}
private ActionResult ajaxSearchGetResult(string title, string author, string source, int id = 1)
{
using (var db = new DataContext())
{
var qry = db.Articles.AsQueryable();
if (!string.IsNullOrWhiteSpace(title))
qry = qry.Where(a => a.Title.Contains(title));
if (!string.IsNullOrWhiteSpace(author))
qry = qry.Where(a => a.Author.Contains(author));
if (!string.IsNullOrWhiteSpace(source))
qry = qry.Where(a => a.Source.Contains(source));
var model = qry.OrderByDescending(a => a.PubDate).ToPagedList(id, 5);
if (Request.IsAjaxRequest())
return PartialView("_AjaxSearchGet", model);
return View(model);
}
}