代码之家  ›  专栏  ›  技术社区  ›  Gyuzal

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

  •  13
  • Gyuzal  · 技术社区  · 11 年前

    如果有人能就以下方面提出建议,我将不胜感激: 在我的视图中,我显示项目列表:

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

    我的寻呼机是这样的:

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

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

    3 回复  |  直到 11 年前
        1
  •  32
  •   Darin Dimitrov    11 年前

    你不能使用Ajax.ActionLink,但你可以Ajax化链接。将寻呼机放在 <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>
    

    然后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;
        });
    });
    

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

        2
  •  8
  •   bummi Haisum Usman    10 年前

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

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

        3
  •  3
  •   Community Egal    7 年前

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

    简短回答:
    在为寻呼机配置AjaxOptions时, 确保你设置了你的区域 (适当)

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

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

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

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

    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>
    

    在将该表重构为部分视图(以封装逻辑(并处理分页)时,我开始获得 “找不到局部视图'_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>
            }
    

    我进行了一系列更改,试图将该区域强制进入Html.Partial()调用,包括:
    修改路由的处理方式, 没用 .
    How to set a Default Route (To an Area) in MVC
    完全限定到局部视图的路径, 它确实有效,但很难看 .
    mvc3 - using partial views in a different area
    对加载部分视图的研究向我展示了MVC引擎是如何处理请求的。这让我重新开始修改Ajax Pager,以便在每个请求中发送区域。我尝试使用与Html.ActionLink类似的语法。(这不起作用)

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

    这不起作用,所以失败了,我镜像了设置控制器的模式,这导致我们:

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

    我从中得到的个人教训是:C#!=剃刀!=Java脚本。每个人做事情的方式都略有不同,你必须确保你知道你的写作是为了哪种语言。