disable some of the input elements when one of the options (radio) is selected

Question

JQuery newbie here.

I have a search form with about 16 fields, most of them are textboxes. rest of them are dropdowns. I have 3 radio buttons beneath these fields. When 1st one is selected, then some of the fields in the form should be disabled. When 2nd or 3rd radio option is selected, all fields should be enabled. I have the following code form this post. But it disables only two textboxes by its names. Anything better than this code?

Lets assume, the radio button names are option1 , option2 , option3 .

Answer 1

$(":radio").change(function() {
    if ($(this).val() == "option1") {
        // When first button is selected, disable some fields
        $("#field1, #field2, #field3").prop('disabled', true);
    } else {
        // Otherwise enable the fields
        $("#field1, #field2, #field3").prop('disabled', false);
    }
});

Just add more fields to the selector to enable and disable all the appropriate fields.

Instead of listing all the IDs, you should give them a class in the HTML:

<input type="text" class="disable" name="whatever"/>

Then you can do:

$(".disable").prop('disabled', true);

to disable all the fields with class="disable" at once.