jQuery - Enable form fields with checkboxes
jQuery - Enable form fields. If either checkbox is checked the 2 Email fields should be enabled.
by Nirvanachain
HTML
<form id="myForm">
<h3>Section 1</h3>
Checkbox 1: <input type="checkbox" name="checkbox1" id="checkboxOne" />
<p><input type="text" id="emailAddr" name="myEmailAddr" placeholder="Email" disabled /></p>
<p><input type="text" id="emailConfirm" name="myEmailConfirm" placeholder="Confirm Email" disabled /></p>
<p><input type="text" id="fullName" name="myFullName" placeholder="Full Name" disabled /></p>
<h3>Section 2</h3>
Checkbox 2: <input type="checkbox" name="checkbox2" id="checkboxTwo" />
<p><input type="text" id="color" name="myColor" placeholder="Color" disabled /></p>
<p><input type="text" id="size" name="mySize" placeholder="Size" disabled /></p>
<p><input type="text" id="model" name="myModel" placeholder="Model" disabled /></p>
</form>
JavaScript
/***
When Checkbox1 is checked Email, Confirm Email, and Full Name should be enabled.
When Checkbox2 is checked Email, Confirm Email, Color, Size, and Model should be enabled
***/
$('#checkboxOne, #checkboxTwo').click(function() {
var cb1 = $('#checkboxOne').is(':checked');
var cb2 = $('#checkboxTwo').is(':checked');
$('#emailAddr, #emailConfirm').prop('disabled', !(cb1 || cb2));
$('#fullName').prop('disabled', !cb1);
$('#color, #size, #model').prop('disabled', !cb2);
});