filter ui.list

Webix JS
#1

Здравствуйте!
Нужно выводить showProgress() при применении фильтра (как в примере http://docs.webix.com/api__link__ui.proto_filter.html) и hideProgress(), когда операция закончилась. Фильтр по большому набору данных - 1000-2000 элементов на экране.
Событий onBeforeFilter и onAfterFilter для ui.list нет.

#2

Здравствуйте!

У листа как такового этих событий нет, однако они есть у DataStore. Из компонента DataSore API можно использовать следующим образом:

on:{
    "data->onBeforeFilter":function(){  },
    "data->onAfterFilter":function(){  }
}

http://webix.com/snippet/4bef3897

#3

Спасибо.
Но на больших списках ситуация такова, что onAfterFilter визуально срабатывает раньше, чем успевает отрисоваться list. Да и onBeforeFilter срабатывает не сразу.
Может быть это связано с тем, что браузер не успевает показать сообщение, занимаясь фильтрацией и отрисовкой. Есть возможность заставить его принудительно обновить экран?

#4

При обычных услових таких проблем возникать не должно.

Метод фильтрации работает с массивом id элементов (list.data.order), а после этого список уже перерисовывается и уже после этого вызывается событиe onAfterFilter. А onBeforeFilter вызывается и вовсе до работы с массивом.

Вот пример с 5000 элементами http://webix.com/snippet/bca1b413.
Поделитесь проблемным кодом, пожалуйста.

#5

Helga, ваш пример: я увеличил кол-во элементов до 90000 - явно видно, что при фильтрации сценарий зависает, а события onBefore и onAfterFilter срабатывают одновременно после окончания операции.
Спасибо.

#6

90000 - это не 1000-2000 элементов, о которых шла речь в начале. В таком случае действительно есть проблемы с отрисовкой, независимо от фильтрации, ведь все 90000 div элементов сразу добавляются в DOM.

Альтернативой может стать использование Webix Datatable, в которой используется стратегия ленивой отрисовки (в нашем блоге есть статья на эту тему), т.е. в DOM-е существуют только видимые в данный момент элементы.

Datatable можно сконфигурировать так, что от list она не будет отличаться: http://webix.com/snippet/fe2b71d9

#7

Спасибо, это действительно решило проблему!