Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
prevent users to check max 3/x items from a checkbox group - Fluent Forms
/**
* 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);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment