Solved

Submit ONCE!

Posted on 2003-10-30
14
228 Views
Last Modified: 2010-08-05
Please modify this form so it can only be submitted once:

<form method="post" action="shout.php" onsubmit="submitForm();">
     <p>Name:  
            <input name="name" type="text" value="Your Name" size="15" maxlength="15">  
            Message:
            <input name="c" type="text" value="Your Message" size="15" maxlength="25">
        </p>
        <center>
     <input id="submit" name="submit" type="submit" value="POST!">
</form>

Thanks.
0
Comment
Question by:CarBoffin
  • 4
  • 3
  • 2
  • +3
14 Comments
 
LVL 15

Accepted Solution

by:
VincentPuglia earned 25 total points
Comment Utility
var submissions = 0
function submitForm(formObj)
{

  ...whatever your validation is...

  return (0 == submissions)
}

Vinny
0
 
LVL 15

Expert Comment

by:VincentPuglia
Comment Utility
<form....onsubmit='if (submitForm(this)) submissions++'>

Vinny
0
 
LVL 2

Assisted Solution

by:yowser
yowser earned 25 total points
Comment Utility
Add a name to the form:

  <form name=form1 method="post" action="shout.php" onsubmit="submitForm();">

then at the top of your existing submitForm function:

  form1.submit.disabled=true;

This will disable the submit button

regards

yowser
0
 
LVL 15

Expert Comment

by:VincentPuglia
Comment Utility
Hi yowser,

I'm sure you meant: document.form1......
Also, you forgot to mention that it only works with browsers that supports 'disabled'

Vinny


0
 
LVL 33

Expert Comment

by:knightEknight
Comment Utility
another way:

<script language="javascript">

 var alreadySubmitted = false;

 function submitForm()
 {
     //  your code here

     // if everything validates properly, then do this:
     return alreadySubmitted = true;
 }

</script>  

<!-- ALSO NOTE:  in the onsubmit below, you must "return" the result of the function:  -->

<form method="post" action="shout.php" onsubmit="return submitForm();">
     <p>Name:  
            <input name="name" type="text" value="Your Name" size="15" maxlength="15">  
            Message:
            <input name="c" type="text" value="Your Message" size="15" maxlength="25">
        </p>
        <center>
     <input id="submit" name="submit" type="submit" value="POST!">
</form>

0
 
LVL 33

Expert Comment

by:knightEknight
Comment Utility
no, no, no, forget that last post ... here is the corrected version:

<script language="javascript">

 var alreadySubmitted = false;

 function submitForm()
 {
     //  your code here

     // if everything validates properly, then do this:
     if ( !alreadySubmitted )
        return alreadySubmitted = true;
     else
        return false;
 }

</script>  
0
Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

 
LVL 33

Expert Comment

by:knightEknight
Comment Utility
... along with this:   onsubmit="return submitForm();"
0
 
LVL 2

Expert Comment

by:yowser
Comment Utility
Vinny

Oops!

You're quite right - I did mean 'document.' Bit of a brain fart there!

As far as the disabled property, it would depend on what CarBoffin wants to do with the final thing. Disabling the button is a more elegant way of acheiving the functionality as it gives a visual clue that the form has been submitted.

Yowser
0
 
LVL 33

Expert Comment

by:knightEknight
Comment Utility
yes, that should be done, but there may be more than one way to submit the form.  Sometimes pressing ENTER on a textbox will also submit.
0
 
LVL 3

Expert Comment

by:applekanna
Comment Utility
0
 

Expert Comment

by:TrentSilverleaf
Comment Utility
Here you are. This should work, but you need to change the form action

<HEAD>

<SCRIPT LANGUAGE="JavaScript">


<!-- Begin
var submitcount=0;

function reset() {
document.emailform.name.value="";
document.emailform.email.value="";
document.emailform.comments.value="";
}

function checkFields() {                       // field validation -
if ( (document.emailform.name.value=="")  ||   // checks if fields are blank.
     (document.emailform.email.value=="") ||   // More validation scripts at
     (document.emailform.comments.value=="") ) // forms.javascriptsource.com
   {
   alert("Please enter your name, email, and comments then re-submit this form.");
   return false;
   }

else
   {
   if (submitcount == 0)
      {
      submitcount++;
      return true;
      }
   else
      {
      alert("This form has already been submitted.  Thanks!");
      return false;
      }
   }
}
//  End -->
</script>
</HEAD>

<BODY OnLoad="reset()">

<form method=post action="HTTP://WWW.MYDATABASE.COM/DTBASE" name="emailform" onSubmit="return checkFields()">

<input type=hidden name=to value="you@your-website-address-here.com">
<input type=hidden name=subject value="Feedback Form">

<pre>
Your Name:   <input type=text name="name">
Your Email:  <input type=text name="email">

Comments?

<textarea name="comments" wrap="virtual" rows="7" cols="45"></Textarea>

<input type=submit value="Submit Form!">

[ Click the submit button twice to see the script in action ]
</pre>
</form>
0
 
LVL 3

Expert Comment

by:makc
Comment Utility
this problem is the best to solve at server side.
all you need is to generate unique submission ID before passing form to client and check before accept it later.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

16 Experts available now in Live!

Get 1:1 Help Now