Drop Down Filter search

I am trying to make a site for a real estate company and I am trying to filter my repeater by state, city, and building type(for lease/for sale). To make things easier I put all the property information in one database. I want the drop down filters to pull from that one database. There would be a drop down for state, city, and building type(for lease/for sale). Once the state value is selected, then the second drop down should enable for the city value, then the third drop down should enable for building type value. I will add my code here:

import wixData from ‘wix-data’;

$w.onReady( function () {

uniqueDropDown1(); 

});

function uniqueDropDown1 (){

wixData.query("PropertyDetailPage") 

    .limit(1000) 

  .find() 

  .then(results => { 

const uniqueTitles = getUniqueTitles(results.items);

       $w("#dropdown1").options = buildOptions(uniqueTitles); 

  }); 

function getUniqueTitles(items) {

const titlesOnly = items.map(item => item.state);

return [… new Set(titlesOnly)];

} 

function buildOptions(uniqueList) {

return uniqueList.map(curr => {

return {label:curr, value:curr};

    }); 

} 

}

export function dropdown1_change(event, $w) {

uniqueDropDown2();

$w(“#dropdown2”).enable();

}

function uniqueDropDown2 (){

wixData.query("PropertyDetailPage") 

    .contains("city", $w("#dropdown1").value) 

    .limit(1000) 

  .find() 

  .then(results => { 

const uniqueTitles = getUniqueTitles(results.items);

       $w("#dropdown2").options = buildOptions(uniqueTitles); 

  }); 

function getUniqueTitles(items) {

const titlesOnly = items.map(item => item.city);

return [… new Set(titlesOnly)];

} 

function buildOptions(uniqueList) {

return uniqueList.map(curr => {

return {label:curr, value:curr};

    }); 

} 

}

export function dropdown2_change(event, $w) {

uniqueDropDown3();

$w(“#dropdown3”).enable();

}

function uniqueDropDown3 (){

wixData.query("PropertyDetailPage") 

    .contains("buildingType", $w("#dropdown2").value) 

    .limit(1000) 

  .find() 

  .then(results => { 

const uniqueTitles = getUniqueTitles(results.items);

       $w("#dropdown3").options = buildOptions(uniqueTitles); 

  }); 

function getUniqueTitles(items) {

const titlesOnly = items.map(item => item.buildingType);

return [… new Set(titlesOnly)];

} 

function buildOptions(uniqueList) {

return uniqueList.map(curr => {

return {label:curr, value:curr};

    }); 

} 

}
The second drop down enables after I choose the value of the state, but then when I click on that drop down the choices for city do not show. The filtering aspect of it does not work either. what am I doing wrong?

Now you can filter a dataset based on the dropdown value (or many dropdowns) via the editor with no code at all. see here:
https://support.wix.com/en/article/filtering-content-based-on-the-user-selection
Maye you’d like to consider it.
Then the only code you’ll need is for enabling the next dropdown.