?
Solved

Submit ONCE!

Posted on 2003-10-30
14
Medium Priority
?
238 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
  • 2
  • +3
14 Comments
 
LVL 15

Accepted Solution

by:
VincentPuglia earned 100 total points
ID: 9649551
var submissions = 0
function submitForm(formObj)
{

  ...whatever your validation is...

  return (0 == submissions)
}

Vinny
0
 
LVL 15

Expert Comment

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

Vinny
0
 
LVL 2

Assisted Solution

by:yowser
yowser earned 100 total points
ID: 9650293
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
WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

 
LVL 15

Expert Comment

by:VincentPuglia
ID: 9650338
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
ID: 9650695
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
ID: 9650714
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
 
LVL 33

Expert Comment

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

Expert Comment

by:yowser
ID: 9650914
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
ID: 9651113
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
ID: 9654950
0
 

Expert Comment

by:TrentSilverleaf
ID: 9663298
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
ID: 9665994
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

WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
Suggested Courses

777 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