Блог

Главная - Вопросы по программированию - Не удалось найти пейджер Kendo Grid с помощью jQuery

Не удалось найти пейджер Kendo Grid с помощью jQuery

#jquery #jquery-ui #kendo-ui #kendo-grid #kendo-asp.net-mvc

#jquery #jquery-пользовательский интерфейс #kendo-ui #kendo-grid #kendo-asp.net-mvc

Вопрос:

Я пытаюсь обновить элементы управления kendo до более новой версии (2020.3.915.440) в моем существующем проекте. Раньше мы использовали kendo controls версии 2014.3.1119.440.

После обновления до более новой версии я не могу получить раскрывающийся список пейджеров, используя приведенный ниже код. Он выдает сообщение об ошибке «Не удается прочитать свойство «привязка» неопределенного«. Он работал с существующей версией. Можете ли вы помочь мне с этим?

    //add change event to kendo pager pageSizes dropdown
        var grid = $("#RptGrid").data("kendoGrid");
        var pageSizeDropDownList = grid.wrapper.children(".k-grid-pager").find("select").data("kendoDropDownList");

        pageSizeDropDownList.bind("change", function(e) {
            var pageSize = e.sender.value();
            localStorage.setItem('RptItemsPerPage', pageSize);
        });

Комментарии:

1. Ошибка означает, что pageSizeDropDownList это не определено. Это говорит о том, что grid он найден, но что-то еще нет. Попробуйте добавить console.log(grid); , может быть, слишком много дочерних элементов или что-то еще слишком неоднозначно. Неясно, какая версия jQuery сейчас используется. Кроме того, вы можете подумать о переходе с .bind() на .on() .

Ответ №1:

Я только что попробовал это, используя эту страницу примера Kendo, и следующий код сработал для меня (однако я обновил приведенный ниже код, чтобы он соответствовал вашему идентификатору сетки)):

 var grid = $("#RptGrid").data("kendoGrid");

var pageSizeDropDownList = grid.wrapper.children(".k-grid-pager").find(".k-dropdown select").data("kendoDropDownList");

Ответ №2:

Это должно сработать:

 var pageSizeDropDownList = $("#RptGrid .k-grid-pager [data-role=dropdownlist]").data("kendoDropDownList");

Теперь в элементе .k-grid-pager имеется более одного элемента ‘select’, поэтому ваш исходный селектор больше не работает.

Ответ G_Ps так же хорош, мы оба просто использовали более конкретный селектор. В подобных случаях используйте инструменты разработчика браузера для проверки элемента, чтобы узнать, как выбрать то, что вам нужно.