How can I disable all elements inside a fieldset in jQuery?

Question

I have 2

s on my page, but one of them should have all of it elements disabled depending on some user\'s choice.

The fieldsets contain text

Answer 1

You can set the disabled attribute of fieldset.

From MDN:

If this Boolean attribute is set, the form controls that are its descendants, except descendants of its first optional element, are disabled, i.e., not editable. They won't receive any browsing events, like mouse clicks or focus-related ones. Often browsers display such controls as gray.

---

HTML:

...

JQuery: $('#myfieldset').prop('disabled', true);

JS: document.getElementById('#myFieldset').disabled = true;

---

IE note:

This does not work quite right on Internet Explorer due to a couple bugs, but works well just about everywhere else (including Edge).

In short, Text and File inputs don't properly disable, and the user can still interact with them.

If this is a deal breaker, you need to go into the and put the disabled attribute on the

's descendant form controls as described in other answers here.

---

Browser support info: http://caniuse.com/#feat=fieldset-disabled