Match Dropdown value to a referenced field

Ask the community
,
1

My website address is https://bhimsen.wixsite.com/bhimsenhtml
In a page called ‘Vegetables’, I made a dropdown box. This page has two datasets–Vegetables dataset, and Recipes dataset. The dropdown box fetches values from Vegetables dataset Primary Field “Title”. The Recipes collection (source for Recipes Dataset) contains a field that refers to the Vegetables collection’s primary field “Title”. I have a table on this page that is connected to Recipes Dataset in which I had the referenced field called baseVeg.
I’m trying to match the value of the dropdown value to the baseVeg column of the table items. The code is:

import wixData from “wix-data”;

$w.onReady( function () {
//TODO: write your page related code here…

});

export function dropdown1_change(event, $w) {

wixData.query('Recipes') 
.contains('baseVeg', $w('#dropdown1').value) 
.find() 
.then(res => { 
    $w('#table1').rows = res.items; 
    $w('#table1').show(); 
});

}

I left the table unhidden during the test process. But when I select the item in the dropdown box, the table becomes blank. I don’t see any errors!

Can somebody help me to solve this problem, please?

Thank you!
Bhimsen

2

Please try using event.target.value (see here ) and see if you get the desired value to filter by

3

I did not understand the usage of the event.target.value in the context of my web page. The wix help center under dropdown box topic mentions that a dropdown box can be connected to a reference field. But the reference field is greyed out when I try to connect the dropdown!