Вы можете добавлять фильтры в коллекцию filters Pivot и Pivot Chart.
Чтобы добавить новый фильтр, используйте метод filters.add(). Он принимает два параметра:
$$("pivot").filters.add("select", true);
$$("pivot").filters.add("datepicker");
Чтобы удалить фильтр, используйте метод filters.remove():
$$("pivot").filters.remove("datepicker");
Related sample: Removing Filters
Чтобы получить список всех фильтров из коллекции filters, используйте метод filters.get():
var filters = $$("pivot").filters.get();
В некоторых случаях возникает необходимости изменить значения фильтрации (например, вы используете фильтр по датам и он возвращает таймштампы, а вы хотите отображать отформатированные даты).
1. Сначала вам нужно добавить в данные свойство, которое будет хранить отформатированную дату ($date). Это можно сделать, напрямую изменив данные, или в scheme $init. Свойства элементов данных, которые начинаются с "$", не добавляются в список "Fields".
2. Далее в свойстве filterMap определите соответствие между исходным полем date и отформатированной датой в $date.
webix.ui({
view: "pivot",
scheme:{
$init: function(item){
item.$date = webix.i18n.parseFormatDate(item.date).valueOf();
}
},
structure: {
filters:[{ name: "date", type: "datepicker" }],
// ...
},
filterMap: {
date: "$date"
}
});
Related sample: DatePicker Filter
По умолчанию фильтры рисуются на тулбаре над таблицей. Вы можете поместить их в другой контейнер с помощью события onViewInit, которое срабатывает во время инициализации фильтров. Обработчик этого события также позволяет изменять настройки фильтров.
В следующем примере элементы "filters" помещены в форму с ID "pivotFilters":
{
id: "pivot",
view: "pivot",
on:{
onViewInit: function(name, config){
if (name == "filters" && $$("pivotFilters"))
webix.ui(config.elements, $$("pivotFilters"));
config.elements = false;
}
},
// ...
},
{
id: "pivotFilters",
view: "form",
rows:[{}]
}
Related sample: Custom Filter Container
Вы можете задать значение для начальной фильтрации в Pivot. Для этого необходимо использовать свойство value объекта фильтра в коллекции filters в момент инициализации Pivot:
webix.ui({
id:"pivot",
view:"pivot",
structure: {
filters:[{ name: "name", type: "text", value:"Argentina" }],
// ...
}
});
В примере выше данные Pivot будут отфильтрованы по значению "Argentina" сразу после инициализации компонента.
Наверх