Removing a Duplicate with Filter to in my Search Code

Ask the community
, , ,
1

Hi there!
I have a search on click code that I have used but I don’t know how to add a dropdown with filter for my repeater.
This is my code for the search function:

import {getAllRecords} from ‘backend/dataService’;
// Backend module named dataService.jsw under backend folder

let unfilteredRecords = ; // This will hold all records

$w.onReady( function () {
$w(“#repeater1”).data = ; // Clear repeater from data
getAllRecords().then((allObjects) => {
unfilteredRecords = allObjects;
// Store all records in array
$w(“#repeater1”).data = unfilteredRecords;
// Set all records to repeater
})
});

// Search button onClick event
export async function searchButton_click(event) {
let searchWord = $w(“#input5”).value;
$w(“#repeater1”).data = unfilteredRecords.filter(obj => obj.occasion.toLowerCase().includes(searchWord.toLowerCase())); // name is fieldKey is Data Collection
}

Below is my code for the dropdown with filter:

import wixData from “wix-data”;
let lastFilterMonth;
$w.onReady(() => {
loadMonths();
});
export function monthDropdown_change(event, $w) {
filter(lastFilterMonth, $w(‘#monthDropdown’).value);
}

function filter(occasion, month) {
if (lastFilterMonth !== month) {
let newFilter = wixData.filter();
if (month)
newFilter = newFilter.contains(‘month’, month);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterMonth = month;
}
}

function loadMonths() {
wixData.query(‘Months’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All Months’}];
options.push(…res.items.map(month => {
return {“value”: month.title, “label”: month.title};
}));
$w(‘#monthDropdown’).options = options;
});

}

The filter works for the dropdown. However, when I search on the search bar, it overrides the dropdown filter whereas it should only search what’s within the dropdown filter result. How do I proceed to make the code as one?
You can see it in action here:

2

You need to only search and filter within the array you created called unfilteredRecords and then use another called filteredRecords. So when someone searches search within unfilteredRecords and set the filteredRecords to the results.

Then when someone uses the dropdown or vice versa check if filteredRecords.length > 0 and if it is there is filteredRecords and then only use those and filter on those the same way you do when you search when someone selects in the dropdown.

When someone resets the filters just filteredRecords = null; to clear it.

You can’t search within the dataset using setFilter in one routine and then search within the array using the other routine. The data you want to search within must be in the same place, so either search in array only, faster. Or search only using setFilters.

3

Thank you!