Hi guys, I have been staring at this code for 4 days trying to get everything to work together. Just when I think I have it right, its not working on the live site. It works perfect on the preview in the editor.
On the live site the second country drop down doesn’t seem to be enabled. Except sometimes if i click it before the page fully loads or if i click on it a few times in a row( out of frustration). the drop down works. Then when i make my selection it disappears and shows nothing in the drop down box. This drop down selection also enables the second drop down box (delivery speed). Which isn’t working either after selecting the country. What am i missing? Apologize this is a lengthy code. Any suggestions are greatly appreciated. Thanks.
import wixData from ‘wix-data’;
import wixWindow from “wix-window”;
$w.onReady( function () {
uniqueDropDown1();
$w(“#country”).enable();
});
function uniqueDropDown1 (){
wixData.query(“testingsinglereport”)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w(“#country”).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 country_change(event) {
uniqueDropDown2();
$w(“#delivery”).enable();
$w(“#delivery”).placeholder = “Select Delivery Speed”;
}
function uniqueDropDown2 (){
wixData.query(“testingsinglereport”)
.contains(“country”, $w(“#country”).value)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w(“#delivery”).options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.spreed);
return [… new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return {label:curr, value:curr};
});
}
}
export function delivery_change(event) {
$w(“#table1”).show();
// Runs a query on the “testingsinglereport” collection
wixData.query(‘testingsinglereport’)
// Query the collection for any items whose “spreed” field contains
// the value the user selected in the dropdown
.contains(‘spreed’, $w(‘#delivery’).value)
.contains(‘country’, $w(‘#country’).value)
.find() // Run the query
.then(res => {
// Set the table data to be the results of the query
$w(‘#table1’).rows = res.items;
});
}
$w.onReady( function () {
$w(“#table1”).columns = [
{
“id”: “col1”, // ID of the column for code purposes
// The field key in the collection whose data this column displays
“dataPath”: “price”,
“label”: “price”, // The column header
“width”: 100, // Column width
“visible”: true , // Column visibility
“type”: “string”, // Data type for the column
// Path for the column if it contains a link
“linkPath”: “link-field-or-property”
}
]}
);