<form id="target">
....
</form>
Asked
Active
Viewed 1.9e+01k times
8 Answers
299
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);
-
21As of jQuery 1.6 you should use `$("#target :input").prop("disabled", true);` – danijel Mar 08 '13 at 09:49
-
4Someone should edit the answer with the updated method -- this is just bad information at this point. – Ben Claar Oct 17 '13 at 18:25
-
and in a submit() callback, using $(this), how to do that? – Olivier Pons Jan 08 '15 at 14:15
-
2@OlivierPons `$(this).closest('form').find('input').prop('disabled', true);`. Not sure if you can consolidate that better, I'm still rather noobish at jQuery. – wjervis Jan 14 '15 at 13:11
43
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);
MetaSkills
- 1,894
- 18
- 15
15
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)
yprez
- 13,376
- 10
- 52
- 70
MetaSkills
- 1,894
- 18
- 15
13
you can add
<fieldset class="fieldset">
and then you can call
$('.fieldset').prop('disabled', true);
Otto Kanellis
- 3,200
- 1
- 21
- 23
9
With this one line you can disable any input field in a form
$('form *').prop('disabled', true);
Samir Rahimy
- 1,416
- 14
- 8
-
this unnecessarily adds a disabled property to every element in the form. – Osvaldo Maria Nov 12 '19 at 12:37
-
@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'). – Samir Rahimy Nov 13 '19 at 16:51
8
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');
Angel Cuenca
- 1,345
- 4
- 21
- 42
1
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);
}
Kenan Begić
- 1,150
- 10
- 21
-1
The definitive answer (covering changes to jQuery api at version 1.6) has been given by Gnarf
Community
- 1
- 1
ErichBSchulz
- 12,945
- 5
- 47
- 50
-
He asked to "disable all inputs inside a form", not just "disable all inputs". – Bengala May 22 '17 at 00:12
-
@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. – ErichBSchulz Sep 25 '18 at 20:29
-
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. – Bengala Sep 26 '18 at 21:06