Hi all,
First of all, Let me link the site page that I am currently working [on.](on.
www.rapidceylon.com/insertdelivery
In)
[www.rapidceylon.com/insertdelivery](on.
www.rapidceylon.com/insertdelivery
In)
This page is where anyone can insert a post. I have used 4 dropdown lists to select the country, province, district and the city. Later I am planning to use these values as a filter.
Anyhow, I have tried the code below to remove the duplicates from the dropdown lists. But, it is not working. If you view the site, you will clearly see it.
import wixLocation from 'wixlocation';
import wixData from 'wix-data';
$w.onReady(function () {
uniqueDropDown1();
});
function uniqueDropDown1 (){
wixData.query("maps")
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w("#dropdown1").options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.country);
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("maps")
.contains("country", $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.province);
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(); //Add your code for this event here:
}
function uniqueDropDown3 (){
wixData.query("maps")
.contains("province", $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.city);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return {label:curr, value:curr};
});
}
}
Could someone please help me with solving this issue. Thanks In Advance.