Kendo UI и jquery scrollTop некорректно работают в браузерах ios и android

При использовании кендо пользовательского интерфейса — управления сеткой я обнаружил, что сброс источника данных не приводит к автоматическому перемещению положения прокрутки сетки вверх.

Это вполне ожидаемое поведение, поэтому после обновления источника данных я добавил вызов jquery scrollTop(0). Это работает в настольных браузерах, но не на iPad.

$("#switch-data-btn").on("click", function(){ 
    grid.dataSource.data(currentData);
    grid.dataSource.transport.data = currentData;
    grid.content.scrollTop(0);
    grid.refresh();
});

http://jsfiddle.net/BFAnK/6/

Затем я решил пойти на ядерный удар и вместо обновления данных сетки уничтожил сетку и перестроил ее. При этом мне больше не нужен вызов scrollTop(0), и с миром все в порядке.

$("#switch-data-btn").on("click", function() {
  buildGrid(currentData); 
  // buildGrid() destroys the grid, empties the dom element and recreates it.
});

http://jsfiddle.net/BFAnK/11/

Приведенное выше решение не идеально, но работает для этого ограниченного сценария. Но как только вы вводите сценарий, в котором вы хотите, чтобы сетка прокручивалась вниз до определенной позиции с помощью scrollTop(), поведение iPad прокручивается до позиции, НО не позволяет вам прокручивать назад, чтобы увидеть и прикрепить более ранние результаты (но работает на рабочем столе). браузеры).

$("#switch-data-btn").on("click", function() {
  buildGrid(currentData);
  grid.content.scrollTop(50);
});

http://jsfiddle.net/BFAnK/12/

Любые идеи о том, как эффективно перезагружать данные в существующий кендо-гри и прокручивать до нужной позиции, которая работает в браузерах IE9+, Chrome, Firefox, iOS и Android?


javascript kendo-grid kendo-ui scrolltop
person Ben Priebe    schedule 20.06.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Кендо оборачивает сетку в обертку прокрутки. Вы можете использовать этот код, чтобы прокрутить его вверх:

grid.wrapper.find(".km-scroll-container").css("-webkit-transform", "");

ОБНОВЛЕНИЕ:

Официальный ответ службы поддержки Кендо:

Метод scrollTop не работает, поскольку на устройствах с сенсорным экраном Grid использует мобильный скроллер. Вы можете сбросить его с помощью метода сброса. Например:

var grid = $("#grid").data("kendoGrid");
grid.content.data("kendoMobileScroller").reset();

Обратите внимание, что выполнение этого кода в настольном браузере приведет к ошибке. Если вы хотите поддерживать оба сценария, вы можете использовать kendo.support.mobileOS — если он не определен, то Grid открывается в настольном браузере, где следует использовать scrollTop.

person ant    schedule 19.11.2013