Estoy tratando de poder agregar parámetros de URL cuando alguien selecciona de una lista desplegable. Quiero que alguien pueda seleccionar una serie y luego seleccionar un año. He probado varias cosas y nada funciona. No estoy muy familiarizado con Javascript, pero logré agregar un parámetro simplemente sin verificar si uno ya está allí y luego agregar otro.
A continuación se muestra mi código.
<center><select id="seasondropdown" class="scheduledropdown" size="1" name="links" onchange="window.location.href=this.value;"> <option value="/results">Combined</option> <option value="/results/?series=latemodels">Late Models</option> <option value="/results/?series=modifieds">Modifieds</option> </select></center> <script> var select = document.getElementById('seasondropdown'); var option; for (var i=0; i<select.options.length; i++){ option = select.options[i]; if (option.value == window.location.href){ option.setAttribute('selected', true); } } </script> <center><select class="scheduledropdown" size="1" name="year" onchange="window.location.href=this.value;"> <option value="/results/?year=2022">2022</option> <option value="/results/?year=2021">2021</option> <option value="/results/?year=2020">2020</option> </select></center> <script> var select = document.getElementById('seasondropdown'); var option; for (var i=0; i<select.options.length; i++){ option = select.options[i]; if (option.value == window.location.href){ option.setAttribute('selected', true); } } </script>Bien, creo que es mejor tener un botón de enviar. Cuando haga clic en él, el botón recuperará el valor de ambas selecciones y lo pondrá como parámetros en la URL. Esto es lo que tengo:
<center> <select id="seasondropdown" class="scheduledropdown" size="1" name="links"> <option value="/results">Combined</option> <option value="/results/?series=latemodels">Late Models</option> <option value="/results/?series=modifieds">Modifieds</option> </select> <select id="yeardropdown" class="scheduledropdown" size="1" name="year"> <option value="?year=2022">2022</option> <option value="?year=2021">2021</option> <option value="?year=2020">2020</option> </select> <button id="btnSubmit">Submit</button> </center> <script> var select1 = document.getElementById('seasondropdown'); var select2 = document.getElementById('yeardropdown'); var btn = document.getElementById('btnSubmit'); btn.onclick = function(e) { e.preventDefault(); var value1 = select1.value; var value2 = select2.value; window.location.href = value1 + value2 } </script>