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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18822352/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-10 13:19:19  来源:igfitidea点击:

Using paging in partial view, asp.net mvc

c#asp.net-mvcasp.net-mvc-partialviewpagedlist

提问by Gyuzal R

I'd greatly appreciate if someone could advise on following: In my view I display the list of items:

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

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

my pager looks like this:

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

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

                                                              })

The problem is that when I click on the next page it is returned blank, without my _Layout. I wouldn't like to reload _Layout all the time. Is there a way to use Ajax.ActionLink for pager? So that I could UpdateTargedIdinside my partial view?

问题是,当我点击下一页时,它返回空白,没有我的_Layout. 我不想一直重新加载 _Layout。有没有办法将 Ajax.ActionLink 用于寻呼机?这样我就可以UpdateTargedId在我的局部视图中?

采纳答案by Darin Dimitrov

You cannot use Ajax.ActionLink but you could AJAXify the links. Put the pager in a <div>:

你不能使用 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>

and then AJAXify the links:

然后对链接进行 AJAX 化:

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

Notice that in the successcallback I've used $('#some_grid_container')which should be some wrapping div around your entire table.

请注意,在success我使用的回调中$('#some_grid_container'),它应该是围绕整个表格的一些环绕 div。

回答by Lodlaiden

My project setup: MVC4, MvcPaging (PagedList), with Areas. This answer is geared towards that setup.

我的项目设置:MVC4,MvcPaging (PagedList),带区域。这个答案是针对该设置的。

Short Answer:
While configuring your AjaxOptions for the pager, ensure you set your area(properly)

简短回答:
在为寻呼机配置 AjaxOptions 时,请确保您设置了区域(正确)

new AjaxOptions { UpdateTargetId = "grid-list" , OnBegin = "beginPaging", 
                  OnSuccess = "successPaging", OnFailure = "failurePaging"}
        , new { area = "Admin", controller = "MyController", action = "Index"}

Long Answer:
The PagedList sample shows how to pass to an area and do paging within an area, but they do not show a sample of how to use paging with a Partial View.

长答案:
PagedList 示例显示了如何传递到一个区域并在一个区域内进行分页,但它们没有显示如何使用 Partial View 进行分页的示例。

The sample project has the following code (taken from _AjaxEmployeeList.cshtml):

示例项目具有以下代码(取自 _AjaxEmployeeList.cshtml):

}, new AjaxOptions
            {
                UpdateTargetId = "grid-list",
                OnBegin = "beginPaging",
                OnSuccess = "successPaging",
                OnFailure = "failurePaging"
            }, 
    new { controller = "Home", action = "Index", 
        employee_name = ViewData["employee_name"] }))

The PagedList sample uses an inline table inside a foreach, so you do not have any problems/conflicts with this setup.

PagedList 示例在 foreach 中使用内联表,因此您在此设置中不会遇到任何问题/冲突。

@using MvcPaging
@model IPagedList<MvcPagingDemo.Models.Employee>
<table class="table table-bordered table-hover">
        @foreach (var item in Model)
        { 
            <tr>
               <td>@item.ID</td>
            </tr>
        }    
</table>

While refactoring this table into a partial view (to encapsulate logic (and to deal with paging), I started to get a "The partial view '_MyPartialView' was not found or no view engine supports the searched locations"

在将此表重构为局部视图(以封装逻辑(并处理分页))时,我开始收到“未找到局部视图 '_MyPartialView' 或没有视图引擎支持搜索的位置”

@using MvcPaging
@using MyProject.Models
@model IPagedList<MyProject.Models.MyModel>
  foreach (var item in Model)
        {
        <div data-task-id="@item.MyModel_ID.ToString()">
            @Html.Partial("_Detail", item)
        </div>
        }

I went through a ration of changes attempting to force the area into the Html.Partial() call, including:
Modifying how routing is handled, which didn't work.
How to set a Default Route (To an Area) in MVC
Fully qualifying the path to the partial view, which did work but was ugly.
mvc3 - using partial views in a different area
The research into getting the partial views to load showed me how the MVC engine processes requests. This sent me back to modifying the Ajax Pager, to send the area with each request. I tried to use a similar syntax as the Html.ActionLink. (This didn't/doesn't work)

我经历了一些尝试强制该区域进入 Html.Partial() 调用的更改,包括:
修改路由的处理方式,但没有用
如何在 MVC 中设置默认路由(到区域)
完全限定到局部视图的路径,这确实有效但很丑陋
mvc3 - 在不同领域
使用局部视图 对加载局部视图的研究向我展示了 MVC 引擎如何处理请求。这让我重新修改 Ajax Pager,以发送每个请求的区域。我尝试使用与 Html.ActionLink 类似的语法。(这没有/不起作用)

@Html.ActionLink("Admin", "Index", "Admin", new { area = "Admin" }, null)

That didn't work,so failing all else, I mirrored the pattern for setting the controller, which leads us to:

那没有用,所以失败了,我镜像了设置控制器的模式,这导致我们:

new AjaxOptions { UpdateTargetId = "grid-list" ,  OnBegin = "beginPaging", 
                  OnSuccess = "successPaging", OnFailure = "failurePaging"}
           , new { area = "Admin", controller = "MyController", action = "Index"}

My personal lesson from this: C# != Razor != Javascript. Each does things slightly differently and you have to be sure you know which language the line your writing is for.

我个人的教训是:C# != Razor != Javascript。每个人做的事情都略有不同,你必须确保你知道你的作品是用哪种语言写的。

回答by Utkarsh

There is still a way to implement Ajax with PagedList.

仍然有一种方法可以使用 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"
        }))

This piece will make ajax request and replace the content with in "targetContainer". It gives you many more options in regards to Ajax call and the way you wish this to be displayed.

这一块将发出ajax请求并将内容替换为“targetContainer”。它为您提供了更多关于 Ajax 调用的选项以及您希望的显示方式。