Coding Article #: 47 - Published On: January 02, 2013 @ 00:13:59 AM - Last Updated on: January 02, 2013

Supported Files
File Download:
carrzkiss_121455Q_27976408.zip
File Size: 3.07 KB
Unzip with
(OR)

This method of Form Submitting will disable the button once the form has been successfully submitted. This helps out a lot if you are not refreshing the page upon form submit.
This method is being used more widely online today, than every before.
A great way to really spice up your site, and give your members or visitors, more piece of mind, when submitting the content to the site.

Credit to: Hielo from Experts Exchange.

View Live Example«

Our JS Code

<script>
var updatepage = function(serverResponse, contentDiv)
{
   //here you do whatever you want with the response
if( '<!-- OK -->'==serverResponse.substring(0,11).toUpperCase() )
  {
     //now disable the button.  Suppose you have
     //<input id="mainButton" ...>
     document.getElementById('mainButton').disabled=true;    
  }
  document.getElementById(contentDiv).innerHTML=serverResponse;
};
</script>

In our FORM button, we make the ID of mainButton.

<form action="Insert.asp" method="post" id="1Form" onsubmit="xmlhttpPost('Insert.asp', '1Form', '1Div', '<img src=\'pleasewait.gif\'>'); return false;">
Leave field blank to test: 
<input type="text" name="T1" value="" />
<input type="submit" name="Submit" value="Send It" id="mainButton"/>
</form>