Thanks Sanford for your reply, I really appreciate it. However, the form is still submit-able when one checkbox is selected from only one section. It shouldn't be submit-able until at least one check box is selected from other two section. Also, I need to add another rule that if "Unsubscribe me from everything" checkbox is selected at the bottom. The form has to be submit-able with everything else unchecked. http://info.hrowen.co.uk/Preference-Centre-2019-LP.html var checkboxGroups = [
{
fieldNames: ["selectDeselectChannels", "Opt_in_Email__c", "Opt_in_Mail__c", "Opt_in_Phone__c", "Opt_in_SMS__c" ],
minChecked: 1,
maxChecked: Infinity,
minMessage: "You must check at least one box in each group!"
},
{
fieldNames: ["selectDeselectContent", "Opt_in_Accessories__c", "Opt_in_Events__c", "Opt_in_MOT_Reminders__c", "Opt_in_News__c", "Opt_in_Offers__c", "Opt_in_Parts__c", "Opt_in_Sales__c", "Opt_in_Service__c", "Opt_in_Service_Reminders__c", "Opt_in_Warranty_Reminders__c" ],
minChecked: 1,
maxChecked: Infinity,
minMessage: "You must check at least one box in each group!"
},
{
fieldNames: ["selectDeselectBrand", "Opt_in_Aston_Martin__c", "Opt_in_Audi__c", "Opt_in_BAC__c", "Opt_in_Bentley__c", "Opt_in_Bugatti__c", "Opt_in_Ferrari__c", "Opt_in_Lamborghini__c", "Opt_in_Lotus__c", "Opt_in_HROwen_Bodytechnics__c", "Opt_in_HROwen_Group__c", "Opt_in_HROwen_Insurance_Services__c", "Opt_in_HROwen_Specialist_Cars__c", "Opt_in_Maserati__c", "Puritalia__c_contact", "Rimac__c_contact", "Opt_in_Rolls_Royce__c" ],
minChecked: 1,
maxChecked: Infinity,
minMessage: "You must check at least one box in each group!"
}
];
// --- no need to edit anything below this line! --
MktoForms2.whenReady(function(form) {
var formEl = form.getFormElem()[0],
arrayFrom = getSelection.call.bind([].slice);
// in real-time, when the max checked is reached, disable remaining 'boxes in the group
checkboxGroups.forEach(function(group) {
var groupEls = formEl.querySelectorAll("#" + group.fieldNames.join(",#"));
arrayFrom(groupEls).forEach(function(el) {
el.addEventListener("click", function(e) {
var numChecked = arrayFrom(groupEls).filter(function(itm) {
return itm.checked;
}).length;
arrayFrom(groupEls).forEach(function(el) {
el.disabled = numChecked == group.maxChecked && !el.checked;
});
});
});
});
// check minimum during validation
form.onValidate(function(nativeValid) {
if (!nativeValid) return;
checkboxGroups.forEach( function(group) {
form.submittable(false);
var groupEls = formEl.querySelectorAll("#" + group.fieldNames.join(",#")),
numChecked = arrayFrom(groupEls).filter(function(itm) {
return itm.checked;
}).length;
if (numChecked < group.minChecked) {
form.showErrorMessage(
group.minMessage,
MktoForms2.$(groupEls[groupEls.length - 1])
);
} else {
form.submittable(true);
}
});
});
});
... View more