Can't make form items 'Required' with multiple choice

Design help General
1

Webflow Form. How can I make sure at least one of these checkboxes are ticked before a customer tries to send a form? I’m aware I can select ‘Required’, but the user may select more than one. If I select ‘Required’ on all of them, then they can’t send without ticking all of them!

Screenshot 2024-12-11 at 17.05.49
Screenshot 2024-12-11 at 17.05.49677×234 20 KB

FYI there will be an additional checkbox of ‘other’.

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

You could do that with custom code.

If your form had an ID of myForm, and this code is in the before-/body section of the page, it will only permit submission if at least one checkbox is selected.

<script> 
const form = document.getElementById('myForm');

form.addEventListener('submit', function (event) {
  const checkboxes = form.querySelectorAll('input[type="checkbox"]');
  const isChecked = Array.from(checkboxes).some(checkbox => checkbox.checked);

  if (!isChecked) {
    event.preventDefault(); // Prevent form submission
    alert('Please select at least one option.');
  }
});
</script>
1 Like
3

Thank you so much! I’ll give it a try. Really appreciate your help with this.