Фильтрация элементов репитера по нескольким тегам выбора в Wix
Я создаю веб-сайт Wix с коллекцией данных (проектов) с несколькими полями тегов выбора (DepartmentTags, orgnisationTags, sectionTags, statusTags). Я создал на своем веб-сайте повторитель для отображения сбора данных и хочу отфильтровать отображаемые элементы на основе нескольких фильтров тегов выбора.
На данный момент я отфильтровал список только на основе одного набора тегов выбора (DepartmentTags). Поэтому, когда выбран DepartmentTag, список проектов, принадлежащих этому отделу, фильтруется.
import wixData from 'wix-data';
const collectionName = 'projects';
$w.onReady(function () {
setRepeatedItemsInRepeater()
loadDataToRepeater()
$w('#departmentTags').onChange((event) => {
const selectedTags = $w('#departmentTags').value
loadDataToRepeater(selectedTags)
})
});
function setRepeatedItemsInRepeater() {
$w('#projectRepeater').onItemReady(($item, itemData) => {
$item('#projectImage').src = itemData.Image;
$item('#projectTitle').text = itemData.Title;
$item('#projectSummary').text = itemData.Summary;
})
}
function loadDataToRepeater(selectedCategories = []) {
let dataQuery = wixData.query(collectionName)
if (selectedCategories.length > 0) {
dataQuery = dataQuery.hasAll('department', selectedCategories)
}
dataQuery
.find()
.then(results => {
const itemsReadyForRepeater = results.items
$w('#projectRepeater').data = itemsReadyForRepeater;
})
}
Теперь я также хочу включить остальные теги выбора в фильтрацию проектов. Например, я хочу, чтобы пользователь мог выбирать отделы, организации и статусы, а перечисленные проекты на ретрансляторе фильтровались по всем трем категориям.
1 ответ
Похоже, вам нужно установить
onChange
всех элементов тега к некоторой функции, например:
function tagChange() {
const selectedDepts = $w('#departmentTags').value;
const selectedOrgs = $w('#organizationTags').value;
const selectedStatuses = $w('#statusTags').value;
loadDataToRepeater(selectedDepts, selectedOrgs, selectedStatuses);
}
Затем измените
loadDataToRepeater
функция будет выглядеть примерно так:
function loadDataToRepeater(selectedDepts, selectedOrgs, selectedStatuses) {
wixData.query(collectionName)
.hasAll('department', selectedDepts)
.hasAll('organization', selectedOrgs)
.hasAll('status', selectedStatuses)
.find()
.then(results => {
$w('#projectRepeater').data = results.items;
});
}