ui.filter

Since 7.1

Компонент для фильтрации данных.

У компонента Filter есть список правил для фильтрации различных типов данных. Вы также можете исключать / включать определенные данные из фильтрации с помощью списка опций.

Подробнее в описательной документации.

Constructor

var data = new webix.DataCollection({
  data:grid_data
});
 
webix.ui({
  view:"filter",
  mode:"text",
  field:"title",
  data: data,
  on:{
    onChange(){
      const filter = this.getFilterFunction();
      data.filter(obj => filter(obj));
      console.log(data.data.order);
    }
  }
});

Where to start

Methods
adjust подстраивает размеры компонента под размеры HTML-контейнера
applyFilter вызывает глобальную фильтрацию для пользовательских инпутов
attachEvent задает обработчик внутреннего события компонента
bind связывает данные компонентов
blockEvent временно блокирует вызов ВСЕХ событий вызывающего объекта
callEvent вызывает внутреннее событие компонента
define переопределяет одну или несколько настроек компонента
destructor разрушает компонент
detachEvent удаляет обработчик события (который был задан ранее методом attachEvent)
disable блокирует компонент (он становится серым, клики по нему не срабатывают)
enable делает активным ранее заблокированный компонент
getChildViews возвращает внутренние компоненты
getFilterFunction возвращает функцию, которая сравнивает данные с заданными в параметрами фильтрации
getFormView возвращает объект формы, которой принадлежит компонент
getNode возвращает HTML-элемент компонента
getParentView возвращает родительский компонент
getTopParentView возвращает самого верхнего родителя
getValue возвращает значение фильтра
hasEvent проверяет, есть ли у компонента обработчики указанного события
hide скрывает компонент
isEnabled проверяет, активен или заблокирован компонент
isVisible проверяет, виден ли компонент
load загружает данные из внешнего источника данных
mapEvent направляет события от одного компонента к другому
parse загружает данные, доступные на клиенте
queryView возвращает внутренние компоненты, которые удовлетворяют указанному условию
resize перерисовывает компонент после изменения размеров
setValue задает значение компонента Filter (условие форматирования и список выбранных значений)
show делает компонент видимым
unbind отменяет связывание компонентов
unblockEvent отменяет блокировку событий, которая была вызвана командой 'blockEvent'
Events
onAfterLoad срабатывает после завершения загрузки данных
onBeforeLoad запускается непосредственно перед началом загрузки данных
onBindRequest срабатывает, когда компонент готов получить данные из главного компонента
onChange срабатывает после любого изменения в компоненте
onDestruct происходит, когда компонент был разрушен деструктором
onLoadError срабатывает при возникновении ошибки во время загрузки данных (невалидный ответ с сервера)
onViewShow срабатывает, когда компонент появляется (вызов метода show())
Properties
animate определяет анимацию для показа компонента в Multiview
borderless скрывает или показывает границы компонента
conditions определяет список пользовательских правил для фильтрации
container HTML-контейнер (или его ID), внутри которого компонент должен быть инициализирован
css имя CSS-класса, который будет присвоен HTML-элементу компонента, или объект со стилями
data данные для компонента (массив, типизированный массив, XML или CSV)
datatype тип загружаемых данных
disabled блокирует или разблокирует компонент
field задает имя поля, по которому нужно фильтровать данные
gravity задает удельный (относительный) размер компонента
height задает высоту компонента
hidden скрывает компонент после его инициализации
id ID компонента
inputs массив инпутов для фильтра
maxHeight задает максимальную высоту компонента
maxWidth задает максимальную ширину компонента
minHeight задает минимальную высоту компонента
minWidth задает минимальную ширину компонента
mode определяет тип данных, к которым будет применяться фильтрация
on позволяет присоединять обработчики к внутренним событиям компонента
padding определяет пространство между границами лейаута и его содержимым
paddingX задает правый и левый отступ внутри лейаута
paddingY задает верхний и нижний отступы внутри лейаута
template определяет вид и содержимое элементов списка в Filter
type определяет границы и отступы в лейауте
url путь к данным, которые загрузятся в компонент сразу после инициализации
value задает начальное значение компонента filter
width задает ширину компонента
Other
$compareValue сравнивает старое значение фильтра с новым
$getSize возвращает текущий размер компонентов
$height текущая высота компонента
$onLoad задает действия по умолчанию во время загрузки данных
$prepareValue приводит входные данные к виду, в котором они попадут в инпут контрола
$setNode определяет HTML-элемент компонента
$setSize задает размеры компонента
$setValue вызывается каждый раз перед тем, как входящее значение попадает в инпут
$skin вызывается после применения скина
$view возвращает HTML-элемент компонента
$width текущая ширина компонента
config все настройки, заданные при инициализации компонента
name возвращает имя компонента (свойство только для чтения)
Наверх