lal rishav lal rishav - 22 days ago 10
HTML Question

Redirect on selecting a select input

<script type="text/javascript">
var x = document.getElementById("mySelect").value;
</script>

<form action="something?val="+x enctype="multipart/form-data" method="post">
<label>Select the Playlist:</label>
<select name="select" id="mySelect">
<option value="#">----Select-----</option>
<option value="playlist1">Playlist1</option>
<option value="playlist2">Playlist2</option>
</select>
<input type="submit">
</form>


Now i want that when i select playlist1 and press the submit button my page should redirect to something?val=playlist1..But it is redirecting to something?val= ..Value of x is not getting printed there.I cannot find the mistake please help.

Answer

assign id to your form so that it is easier to access thru js, like:

...
<form id="myform" action="something" enctype="multipart/form-data" method="post">
...

and use change event handler of select element to change your form's action, such as:

var selectEle = document.getElementById("mySelect");
selectEle.onchange = function(event) {
    var selValue = event.target.value,  
    frm = document.getElementById("myform");
    frm.action = (selValue != "#") ? "something?val=" + selValue : "something";
}