Checkbox switcher for form

Checkbox in form disabled or enabled selects and inputs elements.

by Alexey Demin

HTML

<form action="">
    <select name="sel">
        <option value="1">Option 1</option>
        <option value="2">Option 2</option>
    </select>
    <p><input type="text" name="input1" /></p>
    <p><input type="text" name="input2" /></p>
    <p><input type="text" name="input3" /></p>
    <p><label><input type="checkbox" id="switcher" value="1" />Disable inputs and select?</label></p>
</form>

JavaScript

/* attach event to checkbox */
$("#switcher").on("change", function () {

    /* select and save elements to local var */
    var $elems = $(this)
        .closest("form")
        .find("input").not(this)
        .add("select");

    /* disable or enable elements, which select before */
    if ($(this).is(":checked")) {
        $elems.attr("disabled", "disabled");
    } else {
        $elems.removeAttr("disabled", "disabled");
    }

});