Universal Related Popup Menus / Conditional Submit

Conditional Submit

Universal Related Popup Menus

In order to meet our goal of universality we had to find a way to make a dual function submit button. We knew we needed to call a redirect CGI script with a matching submit button for non-JavaScript enabled browsers, but how could we prevent JavaScript-enabled browsers from calling this script?

JavaScript: The Definitive Guide says that the onClick event handler can not stop a submission for Netscape 2:

The Submit button has the special function of submitting a form to the server. This event handler may add any additional functionality to the Submit button. In Navigator 2.0, there is no way for this onClick() event handler to cancel the submit action or to prevent the form from being submitted; use the Form.onsubmit() event handler to prevent input validation and to cancel form submission if necessary.

In Navigator 3.0, the onClick() event handler may return false to prevent the Submit object from submitting the form. - page 536

The way to cancel a submit button is through the onSubmit() event handler.

...if the data is not valid, the onsubmit() handler may cancel form submission by returning the value false. - page 410.

<FORM ... onSubmit="return false">

Just return "false" to the onSubmit event handler and it will stop the submission. Since this is JavaScript code this construction automatically bypasses the submit CGI script for JavaScript-enabled browsers and calls the redirect CGI for non-JavaScript enabled browsers, as they ignore the onSubmit. The final code looks like this:

<FORM NAME="f1" METHOD="POST" ACTION="/cgi-bin/redirect.cgi" onSubmit="return false">
<SMALL>Pick a topic:</SMALL><BR>
<SELECT NAME="m1" onChange="jmp(this.form,0)">
<OPTION VALUE="/3d/">3D Animation
<OPTION VALUE="/dlab/">Design
...
</SELECT><INPUT TYPE=SUBMIT VALUE="Go" onClick ="jmp(this.form,0)">
</FORM>

For JavaScript browsers clicking on the submit button triggers the jmp() function and for non-JavaScript browsers it calls the redirect.cgi script. A dual function submit button!



Comments are welcome

 


Created: Mar. 10, 1997
Revised: Feb. 12, 1999

URL: https://webreference.com/dev/menus/submit.html