prevent users to check max 3/x items from a checkbox group - Fluent Forms

fluentform-checkbox-max-restriction.js

/**
 * Function to prevent users mark more than expected items.
 * This code must need to be placed in custom JS of your form 
 * @param: containerClass String - The contaner class of the target checkbox block. 
 *           You can add a custom container class in the form settings
 *
 * @param: maxChecked Integer - Max Number of items user can mark
 * @return: void
 *
 */

function maxItemsCheck(containerClass, maxChecked) {
    var checkboxes = $form.find('.'+containerClass+' input');
    checkboxes.on('change', function() {
        var count = $form.find('.'+containerClass+' input:checked').length;
        if(count > maxChecked) {
            alert('You can not check more than '+maxChecked+' items');
            $(this).prop('checked', false);
        }
    });
}

// Example Use case
maxItemsCheck('max_3_items', 3); 

Hello,
Thanks for this Great Code, but you can try checkboxes.on('click', function() instead of checkboxes.on('change', function().
It's the best if we have some fields related to checkbox fields and shown by conditional logic if user click on checkbox.

Thanks