[thelist] Javascript: onChange to affect the Submit button?

Chris Heilmann lists at onlinetools.org
Tue Mar 15 10:23:59 CST 2005


> Hi all,
>
> I need a "simple" javascript (onChange maybe??) that will allow a
> submit button to go to 1 of 2 pages depending on what is selected in a
> pulldown menu, as shown below.
>
Don't do anything on an element in the page, it is a lot cleaner to do so
on submit of the form.

In your case

    	function sendthis(f){
			var elm=f.elements['searchpedigree'];
			switch(elm.options[elm.selectedIndex].value){
				case 'search1':
					window.location='pageA.html';
				break;
				case 'search2':
					window.location='pageA.html';
				break;
			}
			return false;
		}

<form onsubmit="return sendthis(this);" action="sendto.php">
 	<select name="searchpedigree">
 		<option value="search1" selected>Pedigrees</option> <!-- Need this to
 go to pageA.html -->
 		<option value="search2">Shipments</option> <!-- Need this to go to
 pageB.html -->
 	</select>
	<input type="submit">
</form>

Does the trick. Make sure to have a fallback on the server though,
otherwise it won't be possible for non-JS users to navigate.
More information: http://www.evolt.org/forms_javascript/

P.S.: The above example is overly complicated for only two options, but
extendable, and for two options a select is not the cleverest of UI
elements anyway.

-- 
Chris Heilmann
Blog: http://www.wait-till-i.com
Writing: http://icant.co.uk/
Binaries: http://www.onlinetools.org/



More information about the thelist mailing list