MVC 4 Использование выгружаемого списка в частичном представлении

Question

Я пытаюсь реализовать PagedList в частичном представлении.

Описание настроек вида. я имею Controller A with ViewA, Это родительское представление и имеет свою собственную модель. Тогда у меня есть Controller B with PartialViewB и имеет свою собственную модель. Тогда у меня есть Div в ViewA который будет использоваться для отображения PartialViewB, Я могу загрузить в PartialViewB после нажатия кнопки, а затем скрыть вид после повторного нажатия кнопки. В пределах PartialViewB это PagedList. Нажатие кнопки "Следующая страница" загружает следующую страницу, но загружает ее на своей собственной странице, а не в ViewA как было раньше.

Я могу загрузить больше кода по мере необходимости, но сейчас вот пейджер

<br />
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount

    @Html.PagedListPager(Model, page => Url.Action("ViewComments",
    new { courseID = @ViewBag.courseID, page }), 
    new PagedListRenderOptions { MaximumPageNumbersToDisplay = 5, DisplayLinkToFirstPage = PagedListDisplayMode.IfNeeded, 
        DisplayLinkToLastPage = PagedListDisplayMode.IfNeeded })

::РЕДАКТИРОВАТЬ::

Родительский вид

<div class="Comments">
    <input type="button" id="View" class="CommentsButton" value="View Comments"/>
    <input type="hidden" id="Hidden" value="false" />
</div>
<div id="Comments">
</div>

PartialView

@model PagedList.IPagedList<QIEducationWebApp.Models.CourseComment>
@using PagedList.Mvc;

@{
    ViewBag.Title = "Comments";
}

<h2>Comments!</h2>

<table>

@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.CommentDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.UserName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.CommentText)
        </td>
    </tr>
}

</table>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

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

<br />
    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount

    @Html.PagedListPager(Model, page => Url.Action("ViewComments",
    new { courseID = @ViewBag.courseID, page }),
            PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing(
                new PagedListRenderOptions { MaximumPageNumbersToDisplay = 5, DisplayLinkToFirstPage = PagedListDisplayMode.IfNeeded, 
                DisplayLinkToLastPage = PagedListDisplayMode.IfNeeded },
                new AjaxOptions() { HttpMethod = "GET", UpdateTargetId = "Comments" }))

BundleConfig.cs

public class BundleConfig
    {
        // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.unobtrusive*",
                        "~/Scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

            bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css", "~/Content/PagedList.css"));

            bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
                        "~/Content/themes/base/jquery.ui.core.css",
                        "~/Content/themes/base/jquery.ui.resizable.css",
                        "~/Content/themes/base/jquery.ui.selectable.css",
                        "~/Content/themes/base/jquery.ui.accordion.css",
                        "~/Content/themes/base/jquery.ui.autocomplete.css",
                        "~/Content/themes/base/jquery.ui.button.css",
                        "~/Content/themes/base/jquery.ui.dialog.css",
                        "~/Content/themes/base/jquery.ui.slider.css",
                        "~/Content/themes/base/jquery.ui.tabs.css",
                        "~/Content/themes/base/jquery.ui.datepicker.css",
                        "~/Content/themes/base/jquery.ui.progressbar.css",
                        "~/Content/themes/base/jquery.ui.theme.css"));
        }
    }

Answer 1

Проверьте это: связанный вопрос SO

Это будет использовать ненавязчивый Ajax, чтобы сделать замену для вас. Вам просто нужно обработать извлечение и пропустить на своем конце и отправить обратно новый частичный вид вместе с моделью.

@Html.PagedListPager(Model, page => Url.Action("ViewComments", page }), PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing( new AjaxOptions(){  HttpMethod = "GET", UpdateTargetId = "partialContainerYouNeedToReplace"}))

Убедитесь, что у вас есть ненавязчивые ссылки на вашу страницу при этом. Он поставляется с MVC из коробки, и вам просто нужно сослаться на пакет.

Надеюсь это поможет.