asp.net 通过ajax实现无刷新分页

本篇文章主要介绍了 asp.net mvc4 使用ajax结合分页插件实现无刷新分页，ajax通过回调函数把控制器返回的分部视图内容加载到主视图中显示，有兴趣的可以了解一下。

本文为在mvc4中使用ajax实现无刷新分页demo，记录一下。

解决方案思想：页面数据的初始加载和按页加载都是通过ajax来进行，页面分页链接点击后利用ajax技术发送当前页码到后端控制器，后端控制器根据当前页码和设置的pageSize从数据库中取出对应页的数据。后端控制器处理完后利用PartialView方法把数据返回到分部视图中，利用ViewBag来返回总记录数和pageSize。ajax通过回调函数把控制器返回的分部视图内容加载到主视图中显示。

说明：分页具体的分页导航和样式使用了kkpager插件。

1、主视图（用于显示数据）代码

2、分部视图代码

@model IEnumerable
@{
  ViewBag.Title = "AjaxFenbuView";
}
  
    
      @Html.DisplayNameFor(model => model.Uid) 
   
    
      @Html.DisplayNameFor(model => model.Uname)
    
    
      @Html.DisplayNameFor(model => model.Upwd)
    
    
      @Html.DisplayNameFor(model => model.Udata)
    
    
  
@foreach (Test13.Models.TestDataDB item in Model)
{
    
      @item.Uid
      @item.Uname
      @item.Upwd
      @item.Udata
      
        @Html.ActionLink("编辑", "Edit", new { id=item.ID }) |
        @Html.ActionLink("查看详细", "Details", new { id=item.ID }) |
        @Html.ActionLink("删除", "Delete", new { id=item.ID })
      
    
}

3、控制器获取数据代码

 private readonly int pageSize =1;
    public ActionResult AjaxFenYe()
    {
      ViewBag.PageSize = pageSize;
      ViewBag.TotalCount = db.TestDataDBS.Count();
      return View();
    }
    public ActionResult AjaxPaging(int pageIndex = 1)
    {
      var persons = (from p in db.TestDataDBS orderby p.ID descending select p).Skip((pageIndex - 1) * pageSize).Take(pageSize);
      return PartialView("AjaxFenbuView", persons.ToList());
    }

最后上个效果图：

jquery实现无刷新分页插件

jquery实现无刷新分页插件免费下载

下载

【相关推荐】

1.ASP免费视频教程

2.ASP教程

3.李炎恢ASP基础视频教程