Limit checkbox selections

Limiting selections in the browser

To limit the number selections of a Checkbox add the following code to Forms → Settings → Custom CSS & JS → Custom JavaScript.

1
234
5
6
7
8

jQuery(function ($) {
    var $checkboxes = $('.quform-field-1_3').click(function () {        if ($checkboxes.filter(':checked').length > 2) {            $(this).prop('checked', false);
            return false;
        }
    });
});

jQuery(function ($) {
    var $checkboxes = $('.quform-field-1_3').click(function () {
        if ($checkboxes.filter(':checked').length > 2) {
            $(this).prop('checked', false);
            return false;
        }
    });
});

• On line 2, replace 1_3 with the unique ID of the Checkbox element
• On line 3, replace the number 2 with the maximum number of selections allowed

Server-side validation

Using the above code it’s still possible for the form to be submitted with more than the allowed maximum number of selections, for example if JavaScript is disabled. You can prevent the form from being submitted and display a validation error if the form is submitted with more than the maximum number of selections by using a Custom validator. Add the following code to the theme functions.php file (or create a plugin for it).

1234
5
6
7
8

add_filter('quform_element_valid_1_3', function ($valid, $value, Quform_Element_Checkbox $element) {    if (is_array($value) && count($value) > 2) {        $element->addError('Only two choices are allowed');        $valid = false;
    }
 
    return $valid;
}, 10, 3);

add_filter('quform_element_valid_1_3', function ($valid, $value, Quform_Element_Checkbox $element) {
    if (is_array($value) && count($value) > 2) {
        $element->addError('Only two choices are allowed');
        $valid = false;
    }

    return $valid;
}, 10, 3);

12
345
6
7
8
9
10

function quform_element_valid_1_3($valid, $value, Quform_Element_Checkbox $element){
    if (is_array($value) && count($value) > 2) {        $element->addError('Only two choices are allowed');        $valid = false;
    }
 
    return $valid;
}
add_filter('quform_element_valid_1_3', 'quform_element_valid_1_3', 10, 3);

function quform_element_valid_1_3($valid, $value, Quform_Element_Checkbox $element)
{
    if (is_array($value) && count($value) > 2) {
        $element->addError('Only two choices are allowed');
        $valid = false;
    }

    return $valid;
}
add_filter('quform_element_valid_1_3', 'quform_element_valid_1_3', 10, 3);