PHP How To Prevent Multiple Form Submission On Submit With Javascript

Forums Index
» Javascipt Forums
» » PHP How To Prevent Multiple Form Submission on Submit With Javascript

PHP How To Prevent Multiple Form Submission On Submit With Javascript
Post Description:
Post Tags: php, how, to, prevent, multiple, form, submission, on, submit, with, javascript
This Post Has Been Viewed 2912 Times Since Sat Nov 25, 2006 4:13 am Posted By unix with 2 replies

PHP How To Prevent Multiple Form Submission On Submit With Javascript

There are times when you have to have a form on you web page, to obtain information from a user. There are times when a user or visitor hits the submit button twice or multiple times and then you end up with duplicate submissions. To prevent this from happening, you can use javascript to disable the submit button as soon as the user hits the Submit. This will prevent them from hitting the submit button again, thus only one form will be submitted.

This took me a while to figure out. At first I wanted to display a message like "loading page" as soon as the user hit the submit button. also i wanted an image to appear when the submit button was hit, but i couldn't figure out how to do that. So the best i could do was to show a message that said "Searching, Please wait" on the submit button while it is disabled.

So here is the code to put in your html:

first put this code in between the <head> tags:

Code:

Then you can put this form in your <body> tags

Code:

Thats it. if you want to see this script in action, i've made a sample script here. To see it in action, copy and past this code into notepad and save it as sample.html, then open it with your browser.

Code:

Or if you want, you can see a demo by clicking here

Leave Your Comments [ dejar commentarios ]

Comments and replies About PHP How To Prevent Multiple Form Submission On Submit With Javascript

:: 1 :: #811 - Reply By tim On Tue Mar 13, 2007 11:12 am

this is a good how to disabled submit button in a web form using javascript hmlt php

:: 2 :: #4802 - Reply By charl On Wed May 30, 2007 10:02 am

i think this one works better with php

<?
if(isset($_REQUEST['enter']))
{
echo "<h1>submitted</h1>";
}
?>
<script type="text/javascript">
function checkForm(form)
{
// Disable Sumbit Button upon Submission
// http://www.wallpaperama.com/forums
// Please leave our link here
form.SubmitButton.disabled = true;
form.SubmitButton.value = "Searching, Please Wait.";
return true;
}
function resetForm(form)
{
form.SubmitButton.disabled = false;
form.SubmitButton.value = "Search";
}
</script>

<p>This short tutorial will show you how to avoid multiple submissions from users by disabling the submit button once the form has been submitted </p>
<form method="POST" action="" onSubmit="return checkForm(this);">
<p>Your Name:
<input type="text" name="textfield">
(put whatever you want) </p>
<p>Your Comments:
<textarea name="textarea"></textarea>
(put whatever you want)</p>
<p>Notice once you hit the Submit button, you will see the "Submit" change to "Please wait..." and you won't be able to submit the form again. </p>
<p>
<input type="hidden" name="enter" value="1">
<input type="submit" name="SubmitButton" value="Submit">
</p>
</form>
<p align="left"><a href="http://www.wallpaperama.com/forums"><< Go Back</a></p>
<p align="center">Example Tutorial by <a href="http://www.wallpaperama.com">wallpaperama.com</a> </p>