Last active
August 22, 2024 20:46
-
-
Save techjewel/3eba77f1876aa6dc83a0d40f667b175b to your computer and use it in GitHub Desktop.
prevent users to check max 3/x items from a checkbox group - Fluent Forms
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* 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