How to make a web form automatically submit to the drop-down list

Question

I have a form on my page as shown below:

<form name="testform" id="testform" action="test.php" method="get"> <input name="field1" id="field1" type="text" value=""> <input name="field2" id="field2" type="text" value=""> <select name="dropdown" id="dropdown"> <option value="option1" selected="selected">option1</option> <option value="option2">option2</option> <option value="option3">option3</option> </select> <input type="submit" name="Submit" value="Submit" id="Submit"> </form> 

I want the form to submit automatically when the user selects an option from the dropdown menu. How can I do this with or without JavaScript (with or without jQuery)?

Thanks in advance ... :)

blasteralfred

Answer 1

Click (or select)? In this case, the user will not be able to make any choice. You probably mean as soon as another option is chosen. If so

 <select name="dropdown" id="dropdown" onchange="this.form.submit()"> 

If jQuery is used, the unobtrusive change event handler should be used instead of inline javascript.

 $(function(){ $("#dropdown").change( function(e) { this.form.submit(); }); }); 

Use on if form elements are dynamically added to the DOM

 $(function(){ $('#testform').on( "change", "#dropdown", function(e) { this.form.submit(); }); }); 

Answer 2

You will need to use the jQuery change () event.

 ('#dropdown').change( function() { ('#testform').submit(); }) 

Answer 3

I think,

 $('#dropdown').change(function () { $('Submit').click(); } ); 

will do the trick!

Answer 4

Here is the answer

 <form name="testform" id="testform" action="test.php" method="get"> <input name="field1" id="field1" type="text" value=""> <input name="field2" id="field2" type="text" value=""> <select name="dropdown" id="dropdown" onChange="document.testform.submit()"> <option value="option1" selected="selected">option1</option> <option value="option2">option2</option> <option value="option3">option3</option> </select> </form>