使用Pagedlist进行分页时在新页面中呈现局部视图

时间:2013-04-09 17:51:59

标签: jquery asp.net-mvc-3 pagedlist

继续 PartialView rendering on new page 因此,在修复上述问题后,我添加了分页。

处理部分视图和分页的我的控制器方法是

public ActionResult CreateAdmin(string sortOrder, int? page)
    {
        int pageSize = 10;
        int pageNumber = 1;
        if (page != null)
            pageNumber = Convert.ToInt32(page);

        var result = SortResult(sortOrder);

        return PartialView("AdminSearchResult", result.ToPagedList(pageNumber, pageSize));
    }

在我的部分视图中,我正在传递

@model PagedList.IPagedList<MyApplication.Models.Administration>

动态渲染局部视图的jquery是

<script type="text/javascript">
$(document).ready(function (e) {
    $("#SearchResultbtn").click(function (e) {
        e.preventDefault();
        $("#searchResult").load('@Url.Action("AdminSearchResult", "Administration")');
    });
});    

我的观点只是一个表格,如下所示

<table class="searchResult" border="1" width="100%">
    <thead>
        <tr>
            <th>
            </th>
            <th>
                @Html.ActionLink("Last Name", "AdminSearchResult", new { sortOrder = ViewBag.LastNameSortParm, currentFilter = ViewBag.CurrentFilter, @class = "linkClicked" })
            </th>
            <th>
                Middle Name
            </th>
            <th>
                @Html.ActionLink("First Name", "AdminSearchResult", new { sortOrder = ViewBag.FirstNameSortParm, currentFilter = ViewBag.CurrentFilter })
            </th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr class="parent">                    
                <td>
                    @item.LastName
                </td>
                <td>
                    @item.MiddleName
                </td>
                <td>
                    @item.FirstName
                </td>
            </tr>
        }
    </tbody>        
</table>

我的分页和排序工作正常。问题是,当我单击“名字”的ActionLink或任何听众进行排序时,整个局部视图将在新页面中呈现。

我的猜测是jquery需要更新但是如何更新。

1 个答案:

答案 0 :(得分:1)

从你提到的行为来看,我认为你只需要这样的事情:

@Ajax.ActionLink("First Name", "AdminSearchResult", new { sortOrder = ViewBag.FirstNameSortParm, currentFilter = ViewBag.CurrentFilter }, new AjaxOptions { UpdateTargetId = "searchResult" }, null)

基本上是对页面进行部分更新,而不是整页刷新?

要在MVC中成功使用ajax方法,您需要执行以下操作。将此密钥添加到web.config中的appsettings:

  <appSettings>
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

除了包含不引人注目的ajax脚本:

<script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>