Have you ever used the onChange event to submit a form?
onChange="document.form1.submit();"If you are creating a form that submits as soon as a change is made to any selection, make sure you remove the "submit" button first, or you will get a javascript error similar to:
"document.form1.submit is not a function"
This is because it is confusing the "submit" button object (name="submit") with the function "submit()".
See this test for an example.
Browser treatment of this varies - I haven't tested it thoroughly in all of them.
Also note: radio buttons don't support the onChange event in Safari, so I have used onClick on the radio buttons.
Thanks to Webprodevelopment for the tip
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html xmlns=\"http://www.w3.org/1999/xhtml\">
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=ISO-8859-1\" />
<title>onChange test</title>
</head><body>
This form has both a submit button and onChange and onClick events that call the function \"submit()\"
<form name=\"form1\" method=\"get\" action=\"resultPage.htm\" >
<select name=\"select1\" size=\"3\" onChange=\"document.form1.submit();\">
<option value=\"1\" selected=\"selected\" >option 1</option>
<option value=\"2\">option 2</option>
<option value=\"3\">option 3</option>
</select><p>
<label>
<input type=\"radio\" name=\"Radio1\" value=\"radio1\" onChange=\"document.form1.submit();\" />
Radio1</label>
<br />
<label>
<input type=\"radio\" name=\"Radio2\" value=\"radio2\" onClick=\"document.form1.submit();\"/>
Radio2</label>
<p><input type=\"button\" name=\"submit\" value=\"Go\" />
</form>
<hr />
This form has only the onChange and onClick events that call the function \"submit()\"
<form name=\"form2\" method=\"get\" action=\"resultPage.htm\"></p>
<select name=\"select2\" size=\"3\" onChange=\"document.form2.submit();\">
<option value=\"1\" selected=\"selected\" >option 1</option>
<option value=\"2\">option 2</option>
<option value=\"3\">option 3</option>
</select>
<p>
<label >
<input type=\"radio\" name=\"RadioGroup2\" value=\"radio1\" onClick=\"document.form2.submit();\"/>
Radio1</label>
<br />
<label>
<input type=\"radio\" name=\"RadioGroup2\" value=\"radio2\" onClick=\"document.form2.submit();\"/>
Radio2</label>
<br />
</form>
</body>
</html>
Ads by Google
Posted by ellen at October 08, 2006 06:10 PM
it might be easier just to change the name= attribute on the submit button than remove it altogether. That way you can have both a button and onchange event.
Thank you man. Such a minor problem but major issue. Thanks for explaining that.
If you are creating a form that submits as soon as a change is made to any selection, make sure you remove the "submit" button first, or you will get a javascript error
So U need to change the button Name like (send ,update or add)
have a nice day!
Hello to all ! Greetings From Poland. very Good Page !
Thanks for this one! Saved me time of debugging.
Thanks! Renamed the submit button and works. Obvious but easy to miss. :)