Today I had an simple task: to disable a button after a click to prevent double submitting the form data. I wanted to solve it as simple as possible. So here’s the final solution
<form method="POST" action-xhr="#"> <input type="submit" value="Submit" name="submitBtn" >It works like a charm – it disables the submit button and it submits the data.
NOTE
I have found a interesting bug in Chrome. My input button had its name set to “submit” (name=”submit”), but then chrome was reporting following error:Uncaught TypeError: Property 'submit' of object #<HTMLFormElement> is not a function generate-form.php:onclickThe reason for the error when trying to call form.submit() is that your submit button is called “submit”. This means that the “submit” property of your Form object is now a reference to the submit button, overriding the “submit” method of the form’s prototype. Renaming the submit button allowed me to call the submit() method without that error, so I renamed it to “submitBtn”.
Tags: disable button onclick, onclick disable button, uncaught typeerror: property \submit\ of object #<htmlformelement> is not a functionThis post helped you out?
Why not buy me a coffee?Related Posts
Can't download new apps to your phone because there isn't enough storage space? Lack of…
This issue started to appear on macOS 13 Ventura after recent Dropbox update. I would…
Since this morning (Feb 5th 2020) search just stopped working on my Windows 10 (version…
Many of you have run into a problem when you were working on some old…
After 10 years of running my main desktop computer on Windows 7 - time has…
I installed VestaCP for a clien on a new dedicated server running CentOS 7. Once…
View Comments
Thanks, nice and straight forward
Thanks so much for the article. Much thanks again. Great.
button gets disabled but does not submit the data.