成都网站建设设计

将想法与焦点和您一起共享

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

今天小编就为大家带来一篇asp.net怎样通过ajax实现无刷新分页的文章。小编觉得挺不错的,为此分享给大家做个参考。一起跟随小编过来看看吧。

兴隆台网站制作公司哪家好,找创新互联公司!从网页设计、网站建设、微信开发、APP开发、自适应网站建设等网站项目制作,到程序开发,运营维护。创新互联公司于2013年成立到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联公司

解决方案思想:页面数据的初始加载和按页加载都是通过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());
    }

最后上个效果图:

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

以上就是asp.net通过ajax实现无刷新分页的具体操作,代码应该是足够清楚的,而且我也相信有相当的一些例子可能是我们日常工作可能会见得到的。通过这篇文章,希望你能收获更多。


名称栏目:asp.net怎样通过ajax实现无刷新分页
标题路径:http://chengdu.cdxwcx.cn/article/jhohgs.html