Hello! On my webpage I have a repeater that is connected to a dataset which displays different items from a database (job postings). I also have a filter system (drop down menus and radio button options) so that people can filter out the contents in the repeater based on different parameters (job listing type, location, experience level, office type).
Up until today, everything seemed to be working fine. The code associated to the filter options was working great the filter options would successfully filter out the repeater items based on what was selected in the drop down menus. However, all of a sudden today, when selecting filtering options and clicking “Search”, the repeater displays only 2 or 3 correct listings, and the rest of the items are duplicates/copies of the first item in the database. For example, if there are 3 items in the database with the value “internship”, it displays 3 items in the repeater once filtered, though only the first one loads properly and the remaining 2 are carbon copies of whatever is in the first row in the database. NOTE: This happens only when using some filter options (even in the same dropdown menu, some work and some bug out in this way), though did not occur before and no changes were made to the code
This is super weird as it did not happen before, and no modification to the code were done. I’ve also noticed that even if I remove the first item in the database, this issue happens again and the duplicated items in the repeater are once again whatever is now the first row of the database.
I’ve double checked that database entries are correctly labelled and there’s no errors in the fields. IMPORTANT NOTE: I think this MIGHT be a database problem since reverting changes/history to when it worked for sure does NOT fix this - it still displays copies of the repeater items when filtered. I update the database with new job listings every Wednesday, and don’t usually touch the code during this.
Here’s a picture of my database columns and the first row (hopefully readable)
This issue is simply beyond me and has drained me of my energy and existence to begin with. I am attaching the code below just in case. The code basically takes values from the database, populates the drop down menus, has a search and clear button function which filters and displays items in the repeater.
import wixData from 'wix-data';
//start of JobField dropdown - work please i beg of
$w.onReady(function () {
wixData.query("jobpostings")
.limit(1000)
.find()
.then(results => {
const uniqueItems = getUniqueItems(results.items);
$w("#countryDropdown").options = buildOptions(uniqueItems);
const uniqueItems2 = getUniqueItemsLoc(results.items);
$w("#companyType").options = buildOptions(uniqueItems2);
const uniqueItems3 = getUniqueItemsType(results.items);
$w("#employment").options = buildOptions(uniqueItems3);
const uniqueItems4 = getUniqueItemsCompany(results.items);
$w("#companySize").options = buildOptions(uniqueItems4);
});
//---------------------------------------------------------//
function getUniqueItems(items) {
const itemsOnly = items.map(item => item.field);
return [...new Set(itemsOnly)];
}
function getUniqueItemsLoc(items) {
const itemsOnly = items.map(item => item.location);
return [...new Set(itemsOnly)];
}
function getUniqueItemsType(items) {
const itemsOnly = items.map(item => item.type);
return [...new Set(itemsOnly)];
}
function getUniqueItemsCompany(items) {
const itemsOnly = items.map(item => item.companyType);
return [...new Set(itemsOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
});
// end of jobField dropdown - please work i beg of you
export function input1_keyPress(event) {
let SearchValue = $w("#input1").value;
$w("#dataset1").setFilter(wixData.filter().contains('jobTitle', SearchValue)
.or (wixData.filter().contains('location', SearchValue))
.or (wixData.filter().contains('field', SearchValue))
.or (wixData.filter().contains('type', SearchValue))
.or (wixData.filter().contains('organization', SearchValue)));
}
export function searchButton_click(event) {
search();
}
function search() {
wixData.query("jobpostings")
.contains("field", String($w("#countryDropdown").value))
.and(wixData.query("jobpostings").contains("location", String($w("#companyType").value)))
.and(wixData.query("jobpostings").contains("type", String($w("#employment").value)))
.and(wixData.query("jobpostings").contains("remote", String($w("#checkboxGroup1").value)))
.and(wixData.query("jobpostings").contains("companyType", String($w("#companySize").value)))
// .and(wixData.query("jobpostings").contains("partners", String($w("#approved").value)))
.find()
.then(results => {
$w("#repeater4").data = results.items;
});
}
// =============================================//
$w.onReady(() => {
$w('#clearButton').onClick(() => {
$w("#countryDropdown").value = undefined
$w("#companyType").value = undefined
$w("#employment").value = undefined
$w("#companySize").value = undefined
$w("#checkboxGroup1").value = undefined
//$w("#approved").value = undefined
$w("#dataset1").setFilter(wixData.filter()
.eq('field', location))
});
});
I would REALLY appreciate help with this as it is urgent and currently live on my webpage. Furthermore, thank you for your time and patience.
THANK YOU!
