.Net MVC4 使用心得（四）分页、Partial View、删除、ajax返回

本文主要是介绍.Net MVC4 使用心得（四）分页、Partial View、删除、ajax返回，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

      分页成功后，下面是ajax的页面操作。众所周知，webform中，对数据做了编辑或者删除操作后，只需调用相应控件的DataBind()方法，就可以在页面更新数据。只要将控件和触发器放在updatepanel里，便可以实现无页面刷新的ajax数据刷新，可谓easy到妈妈再也不用担心。可是到了mvc，似乎一切又回到了最原始的状态，需要手动的提交，通过接口获取刷新后的数据，然后通过js刷新部分页面…… 不胜其烦。

      利用PartialView，似乎比json要好一些，因为不用精确定位每个数据应该放在哪个元素里，或者拼已经写过一遍的html，而且，初始生成View时，也可以用Html.Partial或者Html.RenderPartial载入PartialView。考虑到删除操作 分页控件可能也需要更新，干脆将数据区域+分页控件完全放在PartialView里。 PartialView可以在新建View的时候勾选“创建为部分视图”生成。 在VIew中使用时，可以用Html.Partial直接引用，也可以写个controller做些逻辑，然后返回PartialViewResult类型，在View上使用Html.Action或者Html.RenderAction引用。这里选择后者，从而可以直接用js访问action返回ParitialView

      这样，我可以在调用delete的action时候，通过ajax返回json以告知是否成功，如果不成功，在回调js函数里弹出错误（alert），如果成功，则在回调js函数里调用ajax访问返回PartialView，并将此PartialView替换原来的PartialView区域。

      看代码：

控制器添加

        public PartialViewResult IndexDataList(){int allCount = db.Users.Count();ViewBag.Num = allCount;ViewBag.PageSize = pageSize;int pageIndex, startIndex, endIndex;//获取开始和结束的记录序号，并返回当前页码PagerHelper.GetStartAndEndIndex(allCount, pageSize, out pageIndex, out startIndex, out endIndex);//调用存储过程返回指定序号范围的数据return PartialView("_IndexDataList", db.SelectUserList(startIndex, endIndex));}

添加PartialView

<table cellspacing="0" cellpadding="0" class="tbl_info"><thead><tr><th>@Html.DisplayNameFor(model => model.id)</th><th>@Html.DisplayNameFor(model => model.names)</th><th>@Html.DisplayNameFor(model => model.age)</th><th>@Html.DisplayNameFor(model => model.sex)</th><th>@Html.DisplayNameFor(model => model.videourl)</th><th>@Html.DisplayNameFor(model => model.ip)</th><th>@Html.DisplayNameFor(model => model.subtime)</th><th>管理</th></tr></thead><tbody class="tbl-data">@foreach (var item in Model){<tr><td>@Html.DisplayFor(model => item.id)</td><td>@Html.DisplayFor(model => item.names)</td><td>@Html.DisplayFor(model => item.age)</td><td>@Html.DisplayFor(model => item.sex)</td><td><a href="@Html.DisplayFor(model => item.videourl)">@Html.DisplayFor(model => item.videourl)</a></td><td>@Html.DisplayFor(model => item.ip)</td><td>@Html.DisplayFor(model => item.subtime)</td><td>@Ajax.ActionLink("删除", "del", new { id = item.id }, new AjaxOptions { OnSuccess = "delsuc", Confirm = "确定删除吗？", HttpMethod = "post" })</td></tr>}</tbody>
</table>
<div class="pager">@Html.Pager(new PagerConfig { TotalRecord = ViewBag.Num, PageSize = ViewBag.PageSize, ShowGoTo = true })
</div>

关于pager控件，请查看我的前一篇文章。

然后将原来的列表页View相应部分替换成

    <div id="allinfo">@Html.Partial("_IndexDataList", Model)</div>

同时在本页写一个回调js函数：

        function delsuc(rsl) {if (rsl.success) {$.get('@Url.Action("IndexDataList")', { page: '@PagerHelper.GetRealPageIndex(ViewBag.Num,ViewBag.PageSize)' }, function (data) { $('#allinfo').html(data); })}else {alert('删除失败！');}}

这里开始遇到个问题，返回类型为JsonResult的Controller，默认不允许Get方式获取信息，会返回500，如果要获取，可以使用post、put、delete等方式，也可以将JsonResultBehavior设置为AllowGet。

OK，成功。同时，借着这个思路，可以更新一下Pager实现AjaxPager的Pager。

具体方法，仅仅是在pager设置里增加一个参数选择是否为ajax的pager，并且提供待更新的html元素id。action方式基本同上面讲的，返回partialview。相应Pager的代码已经更新到上一篇文章里。

这篇关于.Net MVC4 使用心得（四）分页、Partial View、删除、ajax返回的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---