How to disable a form on submit using jQuery

Question

I want to disable a form once I submit it. I tried this but it doesn't disable the form:

$( "#myform" ).prop("disabled", true);

I am using jQuery/php/ajax. When the user clicks submit the submit button is disabled and a spinner displays in the button. Server side validation is done and errors are displayed or an email is sent and success message is displayed. In that time when the spinner is going, I don't want the user to be able to change anything on the form like click another radio button for example. The form is pretty quick but you never know..

Disable a "form"? Do you mean disable the form's submit button? Please post a minimal reproducible example and any error messages you're getting. — j08691
– j08691, Commented May 1, 2017 at 17:27
The html form element does not contain/support a disabled attribute. — Tony M
– Tony M, Commented May 1, 2017 at 17:30
Sorry, I didn't explain properly. I am using jQuery/php/ajax. When the user clicks submit the submit button is disabled and a spinner displays in the button. Server side validation is done and errors are displayed or an email is sent and success message is displayed. In that time when the spinner is going, I don't want the user to be able to change anything on the form like click another radio button for example. The form is pretty quick but you never know.. — Iggy's Pop
– Iggy's Pop, Commented May 1, 2017 at 17:32
This question was answered here: stackoverflow.com/questions/9347282/… — Jerry U
– Jerry U, Commented May 1, 2017 at 17:32
Change your spinner into a modal that prevents the user from clicking under it. — j08691
– j08691, Commented May 1, 2017 at 17:33

David · Accepted Answer · 2017-05-01 17:31:44Z

2

I don't think you can "disable" a <form> element. But if its contents are wrapped in a <fieldset> then you can easily disable that:

<form id="myform" method="POST" action="test.php">
    <fieldset>
        <input type="text">
        <textarea></textarea>
        <input type="submit">
    </fieldset>
</form>

And:

$( "#myform fieldset" ).prop("disabled", true);

Example

answered May 1, 2017 at 17:31

David

221k42 gold badges245 silver badges337 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to disable a form on submit using jQuery

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related