What you are searching for is exactly described in the linked post i gave you in my last answer.
The CODE shown in the example works like the following…
-
Searching automatically inside of predefined DATABASE for “UNIQUE-ITEMS” / “UNIQUE-DATA”…
-
…and pulling the results into a preselected/predefined dropdown.
-
You even don’t have to create a specific list with all your wanted CITIES, because the code already take all the infos directly from your database.
Read very carefully the POST and try to understand each of the steps.
The POST will show you all the little intermediate-steps and all the problems you normaly would facing when creating such an automated function, for first time.
The POST-OPENER was also a → beginner, but he was able to manage his problem and if you read and study it, you will also have success.
About the MIXED-MODE → it’s really not recommended to take this way, if you are a beginner. Mixing Wix-Data and Datasets —> in about 90% will cause problems (at least for beginners).
Try to work the LOGIC-WAY → STEP-BY-STEP BRAINSTORMING and CODING…
…like you do here…
I select form one of the 50 states. Let’s say it is Florida. When I select that, all of the profiles in the Repeater associated with the state of Florida pop-up.
Next, when Florida is selected, the 2nd Dropdown then populates all of the cities in Florida. The user can then select from the cities in Florida. Once the City is selected, their search narrows down and more specific profiles are now populated in the Repeater and the user can select the profile they want to view from there.
Write down all needed steps in the right sequence,
Maybe with a starting CLICK onto a button…
- User clicks a button or choose from dropdown.
- A functions starts …
- Returning first results…
- and so on.
After you have your logical structured notices, you start to code them
- For the very first what you code is always…
$w.onReady(()=>{console.log("Page is READY...");
//continue coding here....
});
- Then you add more and more functions and actions to your code, like for example the selected choice of the the dropdown…
$w.onReady(()=>{console.log("Page is READY...");
$w('#myDropdown1_IDhere').onChange(()=>{
});
});
- What should happen in the next step ? —> Yes we want to start the first filtering function, so let us create this function…
$w.onReady(()=>{console.log("Page is READY...");
$w('#myDropdown1_IDhere').onChange(()=>{
my_Searchfunction();
});
});
- Now we need to define this function “my_Searchfunction()”, and tell the function what to do if the function has been called by code…
Creating the function - - → “my_SearchFunction()”
function my_SearchFunction() {
}
What has to be done inside of the function? You wanted to start a FILTER-FUNCTION, right? So let’s do it…(by using the query of Wix-Data-Api)…
function my_SearchFunction() {
wixData.query("myCollection")
.find()
.then((results) => {
if(results.items.length > 0) {
console.log("RESULTS: ", results.items)
console.log(results.items[0]);
} else {
console.log("No matching items found");
}
})
.catch((err) => {console.log("ERROR: ", err);});
}
When working with Wix-APIs, you first have to → IMPORT them to your PROJECT.
So let’s not forget first to import them…
This line goes to the very top of your code.
import wixData from 'wix-data';
Your code till this checkpoint…
import wixData from 'wix-data';
$w.onReady(()=>{console.log("Page is READY...");
$w('#myDropdown1_IDhere').onChange(()=>{
my_Searchfunction();
});
});
function my_SearchFunction() {
wixData.query("myDATABASE_ID_here")
.find()
.eq("add_DB-FIELD_here", "add_VALUE_here")
.then((results) => {
if(results.items.length > 0) {
console.log("RESULTS: ", results.items)
console.log(results.items[0]);
} else {
console.log("No matching items found");
}
})
.catch((err) => {console.log("ERROR: ", err);});
}
You got your FISRT-RESULTS!!!
DB-FIELD → The field where you want to find your items (STRING.
VALUE - → The value you are searching for (STRING).
What next? - - > CONTINUE…
