Как получить страницу элемента Kendo Grid с помощью ServerOperation - PullRequest
Новая
       7

Как получить страницу элемента Kendo Grid с помощью ServerOperation

1 голос
/ 03 октября 2019

Я пытаюсь получить индекс страницы выбранного объекта сетки, в которой используется ServerOperation, но я не знаю, как бы я это сделал без особых сложностей.

В настоящее время я 'Я получаю идентификатор из URL ( https: // ...? ObjectId = 12 ), и я выберу этот элемент в сетке, но сначала я должен показать страницу, так что я 'Я пытаюсь получить номер страницы этой строки.

Проблема в том, что я использую ServerOperation (true). Кроме того, я получаю выгружаемый список без каких-либо фильтров. 

function _displayDetailsModal(id, selectRow = true, focusSelected = true) {  

    $(document).ready(() => {  
        var url = `${urls.Details}/${id}`;  

        if (selectRow) {  
            // GET PAGE OF ITEM THEN  
            // CHANGE TO PAGE THEN  
            kendoGrid.selectById(id);  
        }  
        if (focusSelected) {  
            kendoGrid.focusSelected(); // Scrolls to selected row.  
        }  

        loadModal(url);  
    });  

}

Ответы [ 2 ]

0 голосов
/ 22 октября 2019

Я закончил тем, что делал это на сервере. Вот как я это сделал:

Controller.cs
Вместо отправки только обычного ToDataSourceResult, я добавляю два поля (PageIndex и ObjectId) и отправляю его на фронт-конец, чтобы изменить страницу и выбрать строку. 

[HttpPost("List")]
public IActionResult List([DataSourceRequest] DataSourceRequest request, RequestActionViewModel requestAction)
{
    // Getting the pageIndex of the ObjectId present in requestAction.
    var objectIndex = elementList.FindIndex(el => el.Id == requestAction.ObjectId) + 1;
    var objectPageIndex = Math.Ceiling((decimal)objectIndex / request.PageSize);
    var dataSourceResult = elementList.ToDataSourceResult(request);

    return Json(new {
        Data = dataSourceResult.Data,
        Total = dataSourceResult.Total,
        AggregateResults = dataSourceResult.AggregateResults,
        Errors = dataSourceResult.Errors,
        // Extra fields
        PageIndex = objectPageIndex,
        ObjectId = requestAction.ObjectId
    });
}

index.js
Получаю с сервера страницу и идентификатор элемента, выбираю изменение страницысетки и выберите элемент. 

function onGridRequestEnd(e) {

    this.unbind("requestEnd", onGridRequestEnd);

    if (e.PageIndex) {
        kendoGrid.bind("dataBound", function temp() {
            // Custom method.
            kendoGrid.selectById(e.ObjectId, e.PageIndex);

            // To avoid looping.
            kendoGrid.unbind("dataBound", temp);
        });
    }
}
0 голосов
/ 03 октября 2019

Это то, что вам нужно?

Dojo: https://dojo.telerik.com/iNEViDIm/2

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

Все, что я делаю, это задаю страницу источника данных с помощью метода page, а затем он отключается и выполняет чтение для удаленного источника данных, а затем возвращает эту страницу данных. 

 $('#btnPage').on('click',function(e){
                    var page = $('#pageNumber').val(); 
                    $('#pageLabel').html('Page Selected Is: ' + page); 

                    var ds = $('#grid').data('kendoGrid').dataSource; 

                    ds.page(parseInt(page)); 

                  });

Если вы выберете страницу выше последней доступной, она просто покажет последнюю страницу.

Более подробную информацию можно увидеть здесь: https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/methods/page

Если вам нужна дополнительная информация, дайте мне знать:

...