Learn how to use dropdown and search inputs to filter repeater data in Wix.
Before you insert the code, watch this video to learn how to properly set up your database and content:
Now that you have your site set up, here is the code you will need:
import wixData from 'wix-data'; $w('#resetButton').hide(); export function searchButton_click(event) { search(); } function search() { wixData.query("Properties") .contains("status", String($w('#dropdown1').value)) .and(wixData.query("Properties").contains("propertieType", String($w('#dropdown2').value))) .and(wixData.query("Properties").contains("title", $w('#input1').value) .or(wixData.query("Properties").contains("agentName", $w('#input1').value))) .find() .then(results => { $w('#propertiesRepeater').data = results.items; }); $w('#resetButton').show(); $w('#resetButton').enable(); $w('#searchButton').hide(); } export function resetButton_click(event) { $w('#propertiesDataset').setFilter(wixData.filter()); $w('#dropdown1').value = undefined; $w('#dropdown2').value = undefined; $w('#input1').value = undefined; $w('#searchButton').show(); $w('#searchButton').enable(); $w('#resetButton').hide(); }
To ensure that the code works, make sure you change the names of the elements on your page to match the code OR change the code to match the name of the elements on the page.
Have Fun!