I am using a checkbox to enable/disable a fieldset of input fields in a
form. This toggle worls great, but the checkbox itself won't change it's
state at all.

Here is the code:

   $("#checkBox1").toggle(
       function () {
           this.attr("checked", "checked");
           $("#secondaryOwner input").attr("disabled","");
           $("#secondaryOwner select").attr("disabled","");
           this.attr("checked", "checked");
           $("#secondaryOwner").css("color","#000");
       },
       function () {
           $("#secondaryOwner input").attr("disabled","disabled");
           $("#secondaryOwner select").attr("disabled","disabled");
           this.attr("checked", "");
           $("#secondaryOwner").css("color","#999");
       }
   );

Here is the HTML (though I dont think this is really the source of the
problem):

<fieldset id='secondaryOwner'>
    <legend>
        <label for='checkBox1'>Secondary Owner</label>
        <input type='checkbox' name='secondaryOwnercheckBox'
value="secondaryOwnercheck" class='checkBox' id='checkBox1' />
    </legend>

    <div id='secondaryOwnerpersonal'>
        <label for='secondaryOwnerFirstName'>First Name</label>
        <input type='text' name='secondaryOwnerFirstName'
id='secondaryOwnerFirstName' value='' />

        <label for='secondaryOwnerMI'>Middle Initial</label>
        <input type='text' name='secondaryOwnerMI' id='secondaryOwnerMI'
value=' ' />
        <label for='secondaryOwnerLastName'>Last Name</label>
        <input type='text' name='secondaryOwnerLastName'
id='secondaryOwnerLastName' value=' ' />
    </div>
    <div id='secondaryOwnerbusiness' style='display: none;'>
        <label for='secondaryOwnerName'>Name</label>
        <input type='text' name='secondaryOwnerName' id='secondaryOwnerName'
value=' ' />
    </div>

    <label for='secondaryOwnerSSN' id='so_SSN'>SSN </label>
    <label for='secondaryOwnerSSN' id='so_Fein' style='display: none;'>Fein
Number</label>
    <input type='text' name='secondaryOwnerSSN' id='secondaryOwnerSSN'
value=' ' />

    <div id='so_individualInfo'>
        <label for='secondaryOwnerLicense'>Driver's License # </label>
        <input type='text' name='secondaryOwnerLicense'
id='secondaryOwnerLicense' value=' ' />
        <label for='secondaryOwnerDOB'>DOB (mm/dd/yyyy)</label>
        <input type='text' name='secondaryOwnerDOB' id='secondaryOwnerDOB'
value=' ' />
        <label for='secondaryOwnerSex'>Gender</label>

        <select name='secondaryOwnerSex' id='secondaryOwnerSex'>
            <option value='1'>Male</option>
            <option value='2'>Female</option>
        </select>
    </div>
</fieldset>

Reply via email to