Web Developers: Form Submission

At times we might need to do several different things with an html form.

Submit form data to specific url using POST and GET methods:

(don't forget to set action if is necessary)

<form name="frm" method="POST" action="">
    <input type="submit" name="submit" value="Send"/>
</form>




Submit form data from external link/image using Javascript:

<a href="javascript: void(0);" onclick="document.frm.submit();">Submit Form</a>

For ie6 the above will not work because href is stronger than onclick. If you need that to work with ie6 just:

<span onclick="document.frm.submit();"><a href="javascript: void(0);">Submit Form</a></span>


Submit form data using a button tag:


<form name="frm" method="POST" action="">
    <input type="button" name="submit" value="Send" onclick="document.frm.submit();"/>
</form>

In that case you will lose the response of ENTER key.


Submit form data to a "transparent" page using AJAX call onsubmit:

<form name="frm" onsubmit="javascript:doAjaxCall(getvalue); return false;">
  <input type="submit" name="submit" value="Send"/>
</form>

In case you forget to use return false, your ajax call will happen but will be overlapped by the form action. So you need to stop it in order to see the actual result of your ajax.

* Another use of ajax calls in a form can take place when a change of a data field causes filtering to another field. For instance: choosing the county might be filtering the municipalities.