在局部视图中使用分页,asp.net mvc

Gyu*_*l R 12 c# asp.net-mvc pagedlist asp.net-mvc-partialview

如果有人可以提供以下建议,我将不胜感激:在我的视图中,我显示了项目列表:

@model PagedList.IPagedList<Items>
@using PagedList.Mvc; 
 @foreach (var item in Model)
          {//displaying data}
Run Code Online (Sandbox Code Playgroud)

我的寻呼机看起来像这样:

@Html.PagedListPager(Model, page => Url.Action("Index", new { humanID = ViewBag.HumanID, page = page }),
                                                             new PagedListRenderOptions
                                                             {
                                                                        LinkToFirstPageFormat = "<<",
                                                                        LinkToPreviousPageFormat = "prev",
                                                                        LinkToNextPageFormat = "next",
                                                                        LinkToLastPageFormat = ">>",

                                                              })
Run Code Online (Sandbox Code Playgroud)

问题是,当我点击下一页时,它返回空白,没有我的_Layout.我不想一直重装_Layout.有没有办法使用Ajax.ActionLink for pager?所以我可以UpdateTargedId在局部视野内?

Dar*_*rov 29

您不能使用Ajax.ActionLink,但您可以AJAXify链接.将寻呼机放入<div>:

<div id="myPager">
    @Html.PagedListPager(
        Model, 
        page => Url.Action(
            "Index", 
            new { 
                humanID = ViewBag.HumanID, 
                page = page 
            }
        ),
        new PagedListRenderOptions
        {
            LinkToFirstPageFormat = "<<",
            LinkToPreviousPageFormat = "prev",
            LinkToNextPageFormat = "next",
            LinkToLastPageFormat = ">>",
        }
    )
</div>
Run Code Online (Sandbox Code Playgroud)

然后AJAXify链接:

$(function() {
    $('#myPager').on('click', 'a', function() {
        $.ajax({
            url: this.href,
            type: 'GET',
            cache: false,
            success: function(result) {
                $('#some_grid_container').html(result);
            }
        });
        return false;
    });
});
Run Code Online (Sandbox Code Playgroud)

请注意,在success我使用的回调中$('#some_grid_container'),应该是整个表周围的一些包装div.

  • 糟糕,我的错误.它应该是`$('#myPager').on('click','a',function(){...});`而不是'$('#myPager').on('a', 'click',function(){...});`.感谢您指出了这一点.这允许以*生动*方式订阅click事件,这意味着即使您更新DOM中的页面链接,也不需要再次重新注册Click处理程序. (2认同)

小智 8

还有一种方法可以使用PagedList实现Ajax.

@Html.PagedListPager((IPagedList)Model,
 page => Url.Action("Index", new { humanID= ViewBag.HumanID, page }), PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing(PagedListRenderOptions.PageNumbersOnly,
        new AjaxOptions
        {
            InsertionMode = InsertionMode.Replace,
            HttpMethod = "Get",
            UpdateTargetId = "targetContainer"
        }))
Run Code Online (Sandbox Code Playgroud)

这篇文章将发出ajax请求并用"targetContainer"替换内容.它为您提供了更多关于Ajax调用以及您希望如何显示它的选项.

  • 我看过很多文章,解释了如何使用AjaxOptions来完成类似的工作,但是没有一个让您知道需要jquery.unobtrusive-ajax.js才能使它起作用。您可以放置​​所有想要的Ajax选项,但是如果捆绑包中没有此库,则将无法使用。 (2认同)