[thelist] JavaScripting and Form Submits......

One of the limitations of the FORM tags, is the gray ugly buttons as
well as when using Type=Image the non-ability to detect which 'button'
has been clicked.

Here's a few things I learned over the past few weeks that should come
in handy:

If you are not loathe to use JavaScript to run your forms you have some
more flexibility, but will shut out users that have JavaScript turned
off. The example script should work with both browsers.

a. design your form with nice image buttons as creative as you like.
b. don't use the input type=image tags, stick with img src=
c. wrap all you 'buttons' with an A HREF and use the link to run the a
JavaScript function.
d. Make sure you use the ONMOUSEOVER and ONMOUSEOUT to provide nice user
feedback instead of the 'hacked' link.
e. you can use the ALT tag to provide info also.
f. Add a hidden form field as a placeholder for manipulation later.

example.....

<FORM NAME=FormExample ACTION=./script.cgi METHOD=Post>

<blah blah blah form elements....>
<input type=hidden name=GoLocation value="">

<a href="javascript:SetNavigation('Next')";
ONMOUSEOVER="window.status='Next Page';return true";
onmouseout="self.status='';return true";><IMG SRC=next.gif></a>
<a href="javascript:SetNavigation('Back')";
ONMOUSEOVER="window.status='Previous Page';return true";
onmouseout="self.status='';return true";><IMG SRC=back.gif></a>
<a href="javascript:SetNavigation('Section1')";
ONMOUSEOVER="window.status='Jump to Section 1';return true";
onmouseout="self.status='';return true";><IMG SRC=section1.gif></a>
<a href="javascript:SetNavigation('Section2')";
ONMOUSEOVER="window.status='Jump to Section 2';return true";
onmouseout="self.status='';return true";><IMG SRC=section2.gif></a>

</FORM>

<script language="JavaScript">
    function SetNavigation(varLocation){
        document.FormExample.GoLocation.value = varLocation;
        document.FormExample.submit();
        }
    }
</script>

Notice that each link calles the SetNavigation JavaScript function,
which takes the parameter passed to it, sets the hidden GoLocation field
to the parameter, and then submits the form.

Then your CGI/ASP/PHP script can then look at the GoLocation field value
and act accordingly. 

Good Luck.
-- 
Anthony Baratta