I am trying to do something, but I don’t know if it’s acutally possible…
Basically I’m trying to pass information in the url… (something like this)
<form class="header__search" method="GET" action=""> <input name="q" placeholder="Browse Topics" /> </form>
but instead of using a text input I would like the user to simply click an option in a dropdown menu… (like this)
<form action="" method="GET"> <div class="units-div"> <label for="units">Units:</label> <select name="units" id="units-selection"> <option value="metric">Metric</option> <option value="imperial">Imperial</option> </select> </div> <div class="language-div"> <label for="language">Language:</label> <select name="language" id="language-selection"> <option value="english">English</option> <option value="italian">Italian</option> </option> </select> </div> </form>
Is it possible to do so? Hopefully I’ve explained myself decently lol
Advertisement
Answer
You can do this with javascript and onchange attribute:
<div class="units-div"> <label for="units">Units:</label> <select name="units" id="units-selection" onchange="window.location.href='?units='+units-selection.value+'&language='+language-selection.value"> <option value="metric">Metric</option> <option value="imperial">Imperial</option> </select> </div> <div class="language-div"> <label for="language">Language:</label> <select name="language" id="language-selection" onchange="window.location.href='?units='+units-selection.value+'&language='+language-selection.value"> <option value="english">English</option> <option value="italian">Italian</option> </option> </select> </div>