165
<form id="target"> .... </form> 

8 Answers 8

331

In older versions you could use attr. As of jQuery 1.6 you should use prop instead:

$("#target :input").prop("disabled", true); 

To disable all form elements inside 'target'. See :input:

Matches all input, textarea, select and button elements.

If you only want the <input> elements:

$("#target input").prop("disabled", true); 
Sign up to request clarification or add additional context in comments.

4 Comments

As of jQuery 1.6 you should use $("#target :input").prop("disabled", true);
Someone should edit the answer with the updated method -- this is just bad information at this point.
and in a submit() callback, using $(this), how to do that?
@OlivierPons $(this).closest('form').find('input').prop('disabled', true);. Not sure if you can consolidate that better, I'm still rather noobish at jQuery.
44

Above example is technically incorrect. Per latest jQuery, use the prop() method should be used for things like disabled. See their API page.

To disable all form elements inside 'target', use the :input selector which matches all input, textarea, select and button elements.

$("#target :input").prop("disabled", true); 

If you only want the elements, use this.

$("#target input").prop("disabled", true); 

Comments

18

Also the more concise way is to use their selectors engine. So to disable all form elements in a div or form parent.

$myForm.find(':input:not(:disabled)').prop('disabled',true) 

Comments

16

you can add

 <fieldset class="fieldset"> 

and then you can call

 $('.fieldset').prop('disabled', true); 

Comments

13

With this one line you can disable any input field in a form

$('form *').prop('disabled', true); 

2 Comments

this unnecessarily adds a disabled property to every element in the form.
@OsvaldoMaria yeah, that is because of the star (all) selector, you could add a .custom-class to all input elements you want to disable, then change the selector to $('form .custom-class').prop('disabled', true').
11

To disable all form, as easy as write:

jQuery 1.6+

$("#form :input").prop("disabled", true); 

jQuery 1.5 and below

$("#form :input").attr('disabled','disabled'); 

Comments

3

You can do it like this:

//HTML BUTTON <button type="button" onclick="disableAll()">Disable</button> //Jquery function function disableAll() { //DISABLE ALL FIELDS THAT ARE NOT DISABLED $('form').find(':input:not(:disabled)').prop('disabled', true); //ENABLE ALL FIELDS THAT DISABLED //$('form').find(':input(:disabled)').prop('disabled', false); } 

Comments

0

The definitive answer (covering changes to jQuery api at version 1.6) has been given by Gnarf

3 Comments

He asked to "disable all inputs inside a form", not just "disable all inputs".
@Bengala sure, but you're marking me harshly for being the first to point out the API had changed. At the time I posted this none of the other answers mentioned this point.
I understand, but I think you should include a correct answer with the respective credits, the link just show how to disable all inputs, which I insist, it doesn't answer at all the question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.