how can I disable everything inside a form using javascript/jquery?

Question

I have a form that pop up inside a layer, and I need to make everything inside that form read only regarding what type of input it is. Anyway to do so?

Answer 1

$('#formId input').attr('disabled', true);

Answer 2

$("#formid input, #formid select").attr('disabled',true);

or to make it read-only:

$("#formid input, #formid select").attr('readonly',true);

Answer 3

You can use the :input selector, and do this:

$("#myForm :input").attr('readonly', true);

:input selects all <input>, <select>, <textarea> and <button> elements. Also the attribute is "readonly", if you "disable" the elements they won't be posted to the server, so choose which property you want based on that.

Answer 4

This is quite simple in plain JavaScript and will work efficiently in all browsers that support read-only form inputs (which is pretty much all browsers released in the last decade):

var form = document.getElementById("your_form_id");
var elements = form.elements;
for (var i = 0, len = elements.length; i < len; ++i) {
    elements[i].readOnly = true;
}