I created the following based upon this link:
import wixData from ‘wix-data’;
export function iyear_change(event, $w) {
// Runs a query on the “Wheels2” collection
wixData.query(‘Wheels2’) //dataset that contains my data
// Query the collection for any items whose “Title” field contains
// the value the user selected in the dropdown
.contains(‘Title’, $w(‘#itest’).value) //‘Title is the primary key in my data set’
.find() // Run the query
.then(res => {
// Set the table data to be the results of the query
$w(‘#myTable’).rows = res.items;
});
}
$w.onReady(function () {
$w(“#myTable”).columns = [{
“id”: “a”, //#myTable table column id
“dataPath”: “Title”, //“Title is the field I am trying to capture from my dataset”
“label”: “a”, //#myTable column lable
“width”: 100,
“visible”: true,
“type”: “string”,
}, {
“id”: “b”,
“dataPath”: “vehyear”,
“label”: “b”,
“width”: 100,
“visible”: true,
“type”: “string”,
}, {
“id”: “c”,
“dataPath”: “vehyear”,
“label”: “vehyear”,
“width”: 100,
“visible”: true,
“type”: “string”,
}];
});
//my drop down which is entitled #itest is connected to my field ‘vehyear’ in my data set
//i get no errors in my debugger
//I get no output into #myTable
// Any help is appreciated. What I am trying to accomplish is query my Wheels2 database based upon user drop down input.
Hi Greg,
Could you please supply more details on what you are trying to achieve
As far as I understand, you have dropdown #itest which connected to a dataset backed by “Wheels2” collection and specifically display name is mapped to “vehyear” field in that collection
what iyear_change is connected to? is it being invoked?
Have you considered adding some console.log statements for the different phases of this function in order to understand the different steps are working properly (method was invoked, the value of the selected item in the drop down, wix data query res, etc’). this will give you better visibility on what exactly is not working
Thanks
Adi
Hi Adi
What I am trying to accomplish is to sell refinished rims. I want my users to be able to use a drop down to select a year, make, and model of their car. I want those selections via drop down to query or filter my dataset to match a rim to the year, make, and model selected by the users.
My dataset contains vehicle years, vehicle makes, vehicle models and vehicle rims. There are close to 100,000 records. I will also need to filter the drop downs to exclude multiple repeating years, because many makes have many years. ie ford mustang has been made every year since 1964. So my drop downs contain a lot of repeated years, makes and models.
Here is what my site looks like as of right now…
My updated code:
export function searchField_keyPress() {
wixData.filter(‘Wheels2’)
.filter(‘vehyear’ === $w(‘#itest’).value)
.filter(‘vehmake’ === $w(“#imake”).value)
.filter(‘vehmodel’ === $w(“#imodel”).value)
.find()
.then(res => {
$w(‘#myTable’).rows = res.items;
});
}
I shall keep plugging away but if you have any suggestions I am open to ideas. #itest #imake and #imodel are connected via wix dataset connections for the drop downs. My table is also connected to my dataset using the built in wix feature.
I know code can be written to populate each drop down to filter repeats and I have done that using this code however it doesn’t allow all the years only a handful of them even thought my .limit is set to 1000.
$w.onReady(function () {
// Run a query that returns all the items in the collection
wixData.query(“Wheels2”)
// Get the max possible results from the query
.limit(1000)
.find()
.then(results => {
// Call the function that creates a list of unique titles
const uniqueYears = getUniqueYears(results.items);
// Call the function that builds the options list from the unique titles
$w(“#iyear”).options = buildOptions(uniqueTitles);
});
// Builds an array from the “Title” field only from each item in
// the collection and then removes the duplicates
function getUniqueYears(items) {
// Use the map method to create the titlesOnly object containing all the titles from the query results
const YearsOnly = items.map(item => item.vehyear);
// Return an array with a list of unique titles
return […new Set(YearsOnly)];
}
// Creates an array of objects in the form {label: “label”, value: “value”} from the array of titles
function buildOptions(uniqueList) {
return uniqueYears.map(curr => {
// Use the map method to build the options list in the format {label:uniqueYears, value:uniqueYears}
return {label:curr, value:curr};
});
}
})
Thanks
Greg
