MVC3.0实现AJAX局部刷新分页
实体Model代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.Entity;
using System.ComponentModel.DataAnnotations;
namespace MvcMovie.Models {
public class Movies {
public int ID { get;set; }
[Required(ErrorMessage="必须输入标题")]
public string Title { get; set; }
[Required(ErrorMessage="必须输入发行日期")]
public DateTime ReleaseDate { get; set; }
[Required(ErrorMessage="必须指定种类")]
public string Genre { get; set; }
[Required(ErrorMessage="必须输入票价")]
[Range(1,100,ErrorMessage="票价必须在1元到100元之间")]
public decimal Price { get; set; }
[StringLength(5,ErrorMessage="最多输入5个字符")]
public string Rating { get; set; } }
public class MovieDBContext : DbContext
{
public DbSet<Movies> Movies { get; set; }
protected override void OnModelCreating(DbModelBuilder modelBuilder)
{
modelBuilder.Entity<Movies>().Property(p => p.Price).HasPrecision(18, 2);
}
}
}
控制器Controller代码：
public ActionResult AjaxList(int pageIndex = 1)
{
PagedList<Movies> movies = db.Movies.Where(m => m.ReleaseDate > new DateTime(1984, 6, 1)).OrderBy(m=>m.ID).ToPagedList(pageIndex, 3);
if (Request.IsAjaxRequest())
{
return PartialView("UCMoviesList", movies); //UCMoviesList为局部页面的名称
}
return View(movies);
}
全局页面代码：
@using Webdiyer.WebControls.Mvc
@using MvcMovie.Models;
@model PagedList<Movies>
@{ ViewBag.Title = "Ajax分页列表"; }
<script language="javascript" type="text/javascript" src="/Scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>
<script language="javascript" type="text/javascript" src="/Scripts/MicrosoftAjax.js"></script>
<script language="javascript" type="text/javascript" src="/Scripts/MicrosoftMvcAjax.js"></script>
<h2>Ajax分页列表</h2>
<p>@Html.ActionLink("追加", "Create") </p>
@{Html.RenderPartial("UCMoviesList", Model); } <!-- 嵌入局部刷新页面 -->
局部刷新页面代码：
@using Webdiyer.WebControls.Mvc
@using MvcMovie.Models;
@model PagedList<Movies>
<div id="dvMovies">
<table>
<tr>
<th></th>
<th>Title</th>
<th>ReleaseDate</th>
<th>Genre</th>
<th>Price</th>
<th>Rating</th>
</tr>
@foreach (Movies item in Model) {
<tr>
<td>
@Html.ActionLink("编辑", "Edit", new { id=item.ID }) |
@Html.ActionLink("查看明细", "Details", new { id=item.ID }) |
@Html.ActionLink("删除", "Delete", new { id=item.ID })
</td>
<td>@item.Title</td>
<td>@String.Format("{0:d}", item.ReleaseDate) </td>
<td>@item.Genre</td>
<td>@String.Format("{0:c2}", item.Price)</td>
<td>@item.Rating</td>
</tr>
}
</table>
<p>Ajax分页（仅刷新部分页面，Url不改变）：</p>
<!-- Ajax分页代码必须放在div中，PageIndexParameterName = "pageIndex"中的pageIndex是控制器方法AjaxList的参数，这个参数主要用于传递页码，名称要一致，否则点击下一页没反应 -->
@Ajax.Pager(Model, new PagerOptions { PageIndexParameterName = "pageIndex", ShowDisabledPagerItems = false, SeparatorHtml = " " }, new AjaxOptions { UpdateTargetId = "dvMovies" })
<p>标准url分页（刷新整个页面，Url改变）：</p>
@Html.Pager(Model, new PagerOptions { PageIndexParameterName = "pageIndex", ShowDisabledPagerItems = false, SeparatorHtml = " " }) </div>
