Greetings all, I’m a nubee and am struggling with things that are probably simple, I’ve watched videos, scoured the forums and many (many) tutorials! All I’m trying to do is dynamically populate a dropdown list (without duplicates) and display the results from a dataset in a table. I can get it working WITH duplicates, but after using the code to remove duplicates, I’m lost as to how to display the information in #table1. I’m assuming I need an export handler but not sure how to do that or where to implement it. Any help would be appreciated.
Thanks in advance, here’s the code:
import wixData from ‘wix-data’;
$w.onReady( function () {
// Run a query that returns all the items in the collection
wixData.query(“dataset1”)
// Get the max possible results from the query
.limit(1000)
.find()
.then(results => {
// Call the function that creates a list of unique titles
const uniqueTitles = getUniqueTitles(results.items);
// Call the function that builds the options list from the unique titles
$w(“#dropdown1”).options = buildOptions(uniqueTitles);
});
// Builds an array from the “Title” field only from each item in
// the collection and then removes the duplicates
function getUniqueTitles(items) {
// Use the map method to create the titlesOnly object containing all the titles from the query results
const titlesOnly = items.map(item => item.title);
// Return an array with a list of unique titles
return [… new Set(titlesOnly)];
}
// Creates an array of objects in the form {label: “label”, value: “value”} from the array of titles
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
// Use the map method to build the options list in the format {label:uniqueTitle, value:uniqueTitle}
return {label:curr, value:curr};
});
}
});
//How do i get the above results in the table?
//TABLE:
$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”: “title”,
“label”: “Title”, // The column header
“width”: 150, // 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”
},
{
“id”: “col2”,
“dataPath”: “items”,
“label”: “Item”,
“width”: 150,
“visible”: true ,
“type”: “string”, // Data type for the column
},
{
“id”: “col3”,
“dataPath”: “price”,
“label”: “Price”,
“width”: 150,
“visible”: true ,
“type”: “string”, // Data type for the column
}];
});