Conditional Filtering for Drop downs and display results on another page

Ask the community
,
1

Hello to all ! wondering if there anyone out there that can help…
On my website’s home page i have a search bar with conditional filtering and three different drop down options (first is country, then state, then city).
The first option “country” is always enabled. the second option “state” becomes enabled as soon as i click on “country”; and third option “city” is enabled after i click on “state”. All this works fine on the home page but when my code (after i click “search” on my home page) takes me to the “results” page, the search bar there is populated with the right values that it takes from the home page but it does not perform the search ! (i believe it is because in the “results” page, the second and third drop down start off disabled as well?). When i redo the search a second time directly from the “results” page it all works perfectly.
any help would be greatly appreciated .

2

Where is your code which is used for this function?

3

Good morning Dima,
this is the code i have on my Home page:

import { local } from ‘wix-storage’ ;
import wixLocation from ‘wix-location’ ;
import wixData from ‘wix-data’ ;

$w.onReady( function () {
paeseDropdown()
});

function paeseDropdown() {
wixData.query( “nostreproposte” )
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#paeseDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.paese);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
export function paeseDropdown_change(event) {
regioneDropdown();
$w( “#regioneDropdown” ).enable();
}

function regioneDropdown() {
wixData.query( “nostreproposte” )
.contains( “paese” , $w( “#paeseDropdown” ).value)
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#regioneDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.regione);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
export function regioneDropdown_change(event) {
cittaDropdown();
$w( “#cittaDropdown” ).enable();
}

function cittaDropdown() {
wixData.query( “nostreproposte” )
.contains( “regione” , $w( “#regioneDropdown” ).value)
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#cittaDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.citta);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}

export function ricercaButton_click(event) {
let paese = $w( “#paeseDropdown” ).value;
local.setItem( “paeseSearchword” , paese);
let regione = $w( “#regioneDropdown” ).value;
local.setItem( “regioneSearchword” , regione);
let citta = $w( “#cittaDropdown” ).value;
local.setItem( “cittaSearchword” , citta);
[wixLocation.to(/results);](wixLocation.to(/results);
})
[}](wixLocation.to(/results);
})

and this is the code i have on my Results page:

import { local } from ‘wix-storage’ ;
import wixData from ‘wix-data’ ;

$w.onReady( function () {
var paeseWord = local.getItem( “paeseSearchword” );
$w( “#paeseDropdown” ).value = paeseWord;
$w( “#paeseDropdown” ).placeholder = paeseWord;
var regioneWord = local.getItem( “regioneSearchword” );
$w( “#regioneDropdown” ).value = regioneWord;
$w( “#regioneDropdown” ).placeholder = regioneWord;
var cittaWord = local.getItem( “cittaSearchword” );
$w( “#cittaDropdown” ).value = cittaWord;
$w( “#cittaDropdown” ).placeholder = cittaWord;

$w( '#nostreproposteDataset' ).onReady( **function**  () { 
    search(); 
});

});

$w.onReady( function () {
paeseDropdown()
});

function paeseDropdown() {
wixData.query( “nostreproposte” )
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#paeseDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.paese);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}

export function paeseDropdown_change(event) {
regioneDropdown();
$w( “#regioneDropdown” ).enable();
}

function regioneDropdown() {
wixData.query( “nostreproposte” )
.contains( “paese” , $w( “#paeseDropdown” ).value)
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#regioneDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.regione);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
export function regioneDropdown_change(event) {
cittaDropdown();
$w( “#cittaDropdown” ).enable();
}

function cittaDropdown() {
wixData.query( “nostreproposte” )
.contains( “regione” , $w( “#regioneDropdown” ).value)
.limit( 1000 )
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w( “#cittaDropdown” ).options = buildOptions(uniqueTitles);
});

function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.citta);
return [… new Set(titlesOnly)];
}

function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}

export function ricercaresultsButton_click(event) {
search();
}

function search() {
wixData.query( ‘nostreproposte’ )
.contains( ‘paese’ , $w( “#paeseDropdown” ).value)
.contains( ‘regione’ , $w( “#regioneDropdown” ).value)
.contains( ‘citta’ , $w( “#cittaDropdown” ).value)
.find()
.then(res => {
$w( ‘#mainresultsRepeater’ ).data = res.items;
});
}

4

Hello again,

do i need all this code to fix your issue?
Please put in just the relevant part of your code into CODE-TAGS (use code-tags) to show CODE.

Like this…

... here your CODE-PART which is relevant/related to your issue.

Also perhaps you show a pic of your DB and Drop-Down-Form on both sites, to understand better your project-situation.