Limit amount of checkboxes that can be selected

  • 23 January 2022
  • 2 replies
  • 80 views
E

Hello I am trying to limit the amount of checkboxes a user can select on an Unbounce form (the form is currently on a Lightbox pop-up) to 3 checked.

I’ve tried the following code and also have tried by selecting the class “checkbox” as well. Neither option works on the live page. I have selected to insert script “before closing body tag.”

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

<script>
  var max_limit = 3;
  $(document).ready(function (){
    $("#benefits_checkbox:input:checkbox").each(function (index){
      this.checked = ("#benefits_checkbox:input:checkbox" < max_limit);
    }).change(function (){
      if ($("#benefits_checkbox:input:checkbox:checked").length > max_limit){
        this.checked = false;
      }
    });
  });
</script>

Any help would be appreciated.

2 replies

N

Would absolutely LOVE the answer to this question as well! I’ve been searching for it for over 3mo now 😦

N

I’ve found a JS script that works, however it fails when I embed it into my form code. But that shouldn’t be an issue for your intended purposes. Hope that this works!:

$('input[type=checkbox]').change(function(e){
   if ($('input[type=checkbox]:checked').length > 1) {
        $(this).prop('checked', false)
        alert("Sorry, only 1 selection is allowed.");
   }
})

Stack Overflow - Praveen’s answer

Reply


Terms & ConditionsCookie settings