I have a form that has a checkbox, two addresses a field for a phone number, and a few other fields not important to my issue. I have assigned the class of one the address as contractorAddress, the checkboxes class is contractorAffiliate the phone fields class is simply phone.
When the check box is checked I want to make it so the contractorAddress and phone are not required (in the current collection) and then if unchecked set it back to required. I do not want to change the requirement setting for the other address or any fields in added collections.
My code (see below) currently changes all instances of the contractorAddress and phone as well as the unnamed secondary address in the collection.
So what I'm asking is how to target the correct address and phone fields.
$('.contractorAffiliate input').change(function () {
if ($(this).is(':checked')) {
$('.phone span.cf-required').hide();
$('.phone input').removeClass('required').removeAttr('required');
$('.contractorAddress span.cf-required').hide();
$('.contractorAddress input').removeClass('required').removeAttr('required');
} else {
$('.phone span.cf-required').show();
$('.phone input').attr('required', 'True');
/* addresses are collections so each required field needs set as required accordingly */
$('.contractorAddress span.cf-required').show();
$('.Address1').prop('required',true);
$('.City').prop('required',true);
$('.State').prop('required',true);
$('.Postal').prop('required',true);
}
})