At this moment we are building a new part on our website www.dptwiskunde.nl, which is built using Wix. On one of the pages (not visible for visitors yet) we want our visitors to be able to search for documents especially relevant for them (that is, past exam questions).
The main idea of this page is to create a search form including three input fields (all dropdowns, see screenshot 1). As a result visitors should find all documents satisfying the level (niveau), course (vak) and subject (onderwerp) they selected.
This goes beyond the facilities Wix offers us, so I have to implement this search form by making use of JavaScript code (which I've never used before)
As a beginner, I came up with the following code:
import wixLocation from 'wix-location';
export function dropdown1_change_1(event, $w) {
$w("#dropdown2").enable();
$w("#dropdown3").enable();
$w("#dropdown3").disable();
$w("#button21").enable();
$w("#button21").disable();
}
export function dropdown2_change_1(event, $w) {
$w("#dropdown3").enable();
}
export function dropdown3_change_1(event, $w) {
$w("#button21").enable();
}
$w.onReady(function () {
$w("#button21").onClick( (event, $w) => {
let searchValue = $w("#dropdown1").value;
let searchValue2 = $w("#dropdown2").value;
let searchValue3 = $w("#dropdown3").value;
wixLocation.to("https://rpunder.wixsite.com/dptwiskunde/online-Examenopgaven/Niveau/" + searchValue + searchValue2 + searchValue3);
[enter image description here][1]});
});
Main drawback of this code is that it doesn't allow visitors to only select options from one or two dropdowns, since I am sending them towards a dynamic page with a url including all three options (for this reason the second and third dropdown are disabled at first). A second drawback is that I actually want the input options in the third dropdown to be depending on the input in the first two ones. If a visitors selects its level and course, I only want those subjects to appear that might be useful for him.
I watched a lot of instruction videos but none of them appeared to help me out to solve this problem. Can anyone here do so? Just a quick recap of the problem:
- Visitors should be able to select only one or two inputs and find the relevant results;
- The input options in the third dropdown should be depending on the inputs in the first two dropdowns.
Thanks a million to the one who can help me out!
