Question

I have this form that submits to work.php.

What I want to do is disable the submit button when the form is submitted, then re-enable it after 5 seconds or so, so I don’t get multiple posts.

How can I do this?

Also, if I press the enter key in one of the text boxes while the submit button is not clickable then it will redirect me to work.php which don’t want to happen.

 <form method="post" action="work.php">
        <strong>Message:</strong>
        <input type="text" id="message" name="message" class="message" />
        <input type="submit" id="submit" onClick="this.value='Processing form';this.disabled=true;if(Submitting()){this.form.submit()}else{this.value='Submit';this.disabled=false;}" value="Submit" />
</form>

Answer 1

You don’t need to worry about this. If the user spams the form submit in any way (clicking submit or hitting enter), only one complete request is sent to the server – every time the submit is triggered, it resets the POST and starts again.

Do note that using JavaScript to stop this behaviour is pretty bad, considering it’s incredibly easy to disable JS and spam away, which is one of the reasons why browsers only allow one POST submission at a time.

If you’re using AJAX (which you haven’t specified), then you should use @drrcknlsn’s answer.