how to change the action of a form when the submit button is pressed || make the submit button clickable only once?

Question

I was wondering if there was a way to make a submit button in html on clickable once, I am having an issue with users submitting multiple lines of information into a database because of impatience. I know this is the issue because I have tested it myself, the php written for the queries is solid, the problem is I have users that are impatient.

So my question is this, is there any code regardless of the language be it javascript, jquery, php or otherwise that I can use to either change the action of the form so that it can't be resubmitted over and over again, or to change the type of button of the submit button. I know that I can use javascript to change an element and its contents but is that really necessary or is there a simpler way?

thanks for all of your help.

Answer 1

Have you tried disabaling the button once clicked ? You Could Try something like this.

$("#SubmitButton").click(function(e){
e.preventDefault();
$(this).attr("disabled","disabled");
$("#TargitFormId").submit();
alert("Please wait while we save your information");
//Or you could use a nicer UI Here
});

Answer 2

You must use .submit() instead of .click. Beacuse user may use enter key for submit form. So you can use this code

var hadSent=false;
$("#FormId").submit(function(event){
if(hadSent==true){event.preventDefault()}
hadSent=true; // for prevent next submitions
})