In my html webpage I have a dropdown menu, when the user picks a value from the drop down i would like to show a subsequent dropdown. e.g. dropdown 1 pick value 1 > show dropdown 2. Dropdown 1 pick value 2 > show dropdown 3
I think i am nearly there in my code below, I have my three dropdowns and only the first one shows at the start. However I think I need to specify to have an if statement to say if client 1 selected set the dropdown client 1 to show and if client 2 selected set the dropdown client 2 to show.
I have tried an if
statement but I can't get it working. I'm expecting some sort of syntax error at the very least or what I am trying simply doesn't work in the way I have approached it.
var elem = document.getElementById("client");
var strUser = e.options[e.selectedIndex].value;
if (strUser.value == "Client 1");
elem.onchange = function() {
var hiddenDiv = document.getElementById("client1");
hiddenDiv.style.display = (this.value == "") ? "none" : "block";
};
else
elem.onchange = function() {
var hiddenDiv = document.getElementById("client2");
hiddenDiv.style.display = (this.value == "") ? "none" : "block";
};
<select class="default" id="client" name="client"><option value="" selected>Select Client</option><option value="1">Nike</option><option value="2">Adidas</option></select><select class="default" id="Nike_group" name="Nike_group" style="display: none;"><option value="" selected>Select option</option><option value="1">Zoom</option><option value="2">Vapour</option></select><select class="default" id=Adidas_style" name="adidas_style" style="display: none;"><option value="" selected>Select option</option><option value="1">Running</option><option value="2">Football</option><option value="3">Rugby</option></select><select class="default" id=Adidas_rugby" name="adidas_rugby" style="display: none;"><option value="" selected>Select option</option><option value="1">England</option><option value="2">France</option><option value="3">Wales</option></select><select class="default" id=Adidas_football" name="adidas_football" style="display: none;"><option value="" selected>Select option</option><option value="1">Man UTD</option><option value="2">Chelsea</option><option value="3">Everton</option></select>