Использование подкачки в частичном представлении, asp.net mvc

Я был бы очень признателен, если бы кто-нибудь мог посоветовать следующее: На мой взгляд, я показываю список элементов:

@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 внутри своего частичного обзора?


person Gyuzal R    schedule 16.09.2013    source источник


Ответы (3)


Вы не можете использовать 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>

а затем 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 вокруг всей вашей таблицы.

person Darin Dimitrov    schedule 16.09.2013
comment
Лучшее решение, которое я когда-либо видел! Немного изменен на $ ('# myPager a'). Click (function () {}), и теперь он работает! Большое спасибо! - person Gyuzal R; 16.09.2013
comment
Ой, моя ошибка. Это должно быть $('#myPager').on('click', 'a', function() { ... }); вместо $('#myPager').on('a', 'click', function() { ... });. Спасибо что подметил это. Это позволяет живо подписаться на событие клика, что означает, что даже если вы обновляете ссылки на страницы в DOM, вам не нужно повторно регистрировать обработчик кликов снова. - person Darin Dimitrov; 16.09.2013
comment
@DarinDimitrov: Есть проблема с этим решением. вы нажимаете на страницу 2, хорошо? затем страница 2 отключается. но вы щелкните еще раз на странице 2. она показывает результаты в последних результатах. есть ли способ отключить номер деактивированной страницы? - person Persian.; 25.10.2013
comment
@DarinDimitrov: Я добавляю этот код, и теперь он работает правильно: var lpage; $ ('# myPager'). on ('click', 'a', function () {var page = purl (this.href) .param ('page'); if (page == lpage) {return;} lpage = page; - person Persian.; 25.10.2013
comment
отличное красивое решение для частичного просмотра - person MSTdev; 31.10.2013
comment
@Persian., Я протестировал ваше решение для решения проблемы в коде DarinDimitrov, и у вас возникла проблема. Когда вы перемещаете страницу, потеряете частичную и загрузите всю страницу - person CesarMiguel; 03.03.2014
comment
@ Персидский. я сделал if (this.href == "") { return;}, чтобы решить вашу проблему - person CesarMiguel; 03.03.2014
comment
@DarinDimitrov еще раз большое спасибо, ваши ответы всегда очень полезны. - person Enzero; 08.01.2015
comment
Почему я использую весь макет с помощью этого кода? он просто показывает мое частичное представление после нескольких щелчков по pagelistpager .. первые несколько раз он работает отлично, но затем он начинает глючить .. - person MMM; 21.08.2015
comment
что, если мы хотим добавить закладку, пример: страница 2, как вы сказали, здесь в запросе адресной строки строки отсутствуют в Ajax GET, есть ли какое-либо решение с использованием истории ajax плагины? - person Shaiju T; 22.02.2016
comment
Не работает в ядре asp.net. Где параметры контроллера типа страницы? - person Just Fair; 09.12.2018

Еще есть способ реализовать Ajax с помощью PagedList.

@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 и того, как вы хотите, чтобы это отображалось.

person Utkarsh    schedule 06.09.2014
comment
Я хочу реализовать пейджер, как в вашем сообщении, но ответ не заменяет контент в targetContainer. Что может вызвать это? Спасибо - person demo; 08.02.2016
comment
PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing (targetID) было достаточно для моих нужд - person Ken Mc; 23.03.2016
comment
Я видел много сообщений, объясняющих, как использовать AjaxOptions для подобных вещей, но НИ ОДИН из них не сообщает вам, что вам нужен jquery.unobtrusive-ajax.js, чтобы это работало. Вы можете указать все необходимые параметры Ajax, но если у вас нет этой библиотеки в вашем пакете, ничего работать не будет. - person Barry Franklin; 29.11.2016

Настройка моего проекта: MVC4, MvcPaging (PagedList), с областями. Этот ответ ориентирован на эту настройку.

Краткий ответ:
При настройке AjaxOptions для пейджера убедитесь, что вы правильно указали область.

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

Длинный ответ:
В примере PagedList показано, как перейти к области и выполнить разбиение на страницы внутри области, но они не показывают пример того, как использовать разбиение по страницам с частичным просмотром.

Пример проекта имеет следующий код (взятый из _AjaxEmployeeList.cshtml):

}, 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 (), в том числе:
Изменение способа обработки маршрутизации, что не сработало.
Как установить маршрут по умолчанию (в область ) в MVC
Полное определение пути к частичному представлению, которое действительно работало, но было некрасиво.
mvc3 - использование частичных представлений в другой области
Исследование загрузки частичных представлений показало мне как механизм 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 #! = Razor! = Javascript. Каждый из них работает немного по-своему, и вы должны быть уверены, что знаете, на каком языке написана ваша строка.

person Lodlaiden    schedule 27.11.2013