This page queries my LocalBusiness table, the Tags field (field type = tags). gets it’s content from my Business Categories table.
I used the following code on the page.
Then I decided I would rather use a multi-reference field called Tags2, but now the code won’t filter the businesses based on their categories.
Working page https://www.1425club.com/localbusinesses-1
Can anyone see what is wrong in my code?
Thank you Sylvia
Tags CODE
import wixData from "wix-data";
let lastFilterBusinessCategories = [];
$w.onReady(() => {
// handle each suggestion repeater1 item
$w("#businessCategories").onItemReady(($item, itemData, index) => {
$item('#optionCheckbox').onChange(() => {
filterByCheckboxes()
})
$item("#optionText").text = itemData.value;
});
loadBusinessCategories();
});
function loadBusinessCategories() {
wixData.query('BusinessCategories')
.ascending('title')
.find()
.then(results => {
$w("#businessCategories").data = [];
// Create and map an array for the Business Category Tag options
let businessDropdownOptions = [];
businessDropdownOptions.push(...results.items.map(tags => {
return { "_id": tags._id, "value": tags.title, "label": tags.title };
}));
$w('#businessCategories').data = businessDropdownOptions;
});
}
function filterByCheckboxes() {
let businesses = [];
$w("#businessCategories").forEachItem(($item, itemData, index) => {
if ($item('#optionCheckbox').checked) {
businesses.push($item("#optionText").text);
$w('#numBusinessCategoriesText').text = $item("#optionText").text;
}
});
filter(businesses);
}
function filter(businesses) {
let newBusinessesFilterCheck = compareArrays(businesses, lastFilterBusinessCategories);
if (!newBusinessesFilterCheck) {
let newFilter = wixData.filter();
newFilter = newFilter.hasSome('tags', businesses)
$w('#dynamicDataset').setFilter(newFilter).then(function () {
let count = $w("#dynamicDataset").getTotalCount();
});
lastFilterBusinessCategories = businesses;
}
}
// Code to compare string arrays
// Used to compare the current and previous business selections
function compareArrays(newFilterArray, lastFilterArray) {
if (newFilterArray.length !== lastFilterArray.length) { return false } //Checking if the number of items in the filter arrays match
//Sort both arrays for easy comparison and checking if the items match
let sortedNewFilterArray = newFilterArray.concat().sort()
let sortedLastFilterArray = lastFilterArray.concat().sort()
for (let index in sortedNewFilterArray) {
if (sortedNewFilterArray[index] !== sortedLastFilterArray[index]) return false
}
return true
}
Tags2 Multi-reference CODE
I have changed the Tags to Tags2
// For full API documentation, including code examples, visit https://wix.to/94BuAAs
import wixData from "wix-data";
let lastFilterBusinessCategories = [];
$w.onReady(() => {
// handle each suggestion repeater1 item
$w("#businessCategories").onItemReady(($item, itemData, index) => {
$item('#optionCheckbox').onChange(() => {
filterByCheckboxes()
})
$item("#optionText").text = itemData.value;
});
loadBusinessCategories();
});
function loadBusinessCategories() {
wixData.query('BusinessCategories')
.ascending('title')
.find()
.then(results => {
$w("#businessCategories").data = [];
// Create and map an array for the Business Category Options
let businessDropdownOptions = [];
businessDropdownOptions.push(...results.items.map(tags2 => {
return { "_id": tags2._id, "value": tags2.title, "label": tags2.title };
}));
$w('#businessCategories').data = businessDropdownOptions;
});
}
function filterByCheckboxes() {
let businesses= [];
$w("#businessCategories").forEachItem(($item, itemData, index) => {
if ($item('#optionCheckbox').checked) {
businesses.push($item("#optionText").text);
$w('#selectedCategories').text = $item("#optionText").text;
}
});
filter(businesses)
}
function filter(businesses) {
let newBusinessFilterCheck = compareArrays(businesses, lastFilterBusinessCategories);
if (!newBusinessFilterCheck) {
let newFilter = wixData.filter();
newFilter = newFilter.hasSome('tags2', businesses)
$w('#dynamicDataset').setFilter(newFilter).then(function () {
let count = $w("#dynamicDataset").getTotalCount();
});
lastFilterBusinessCategories = businesses;
}
}
// Code to compare string arrays
// Used to compare the current and previous category selections
function compareArrays(newFilterArray, lastFilterArray) {
if (newFilterArray.length !== lastFilterArray.length) { return false } //Checking if the number of items in the filter arrays match
//Sort both arrays for easy comparison and checking if the items match
let sortedNewFilterArray = newFilterArray.concat().sort()
let sortedLastFilterArray = lastFilterArray.concat().sort()
for (let index in sortedNewFilterArray) {
if (sortedNewFilterArray[index] !== sortedLastFilterArray[index]) return false
}
return true
}
