Hoe je ervoor zorgt dat je bij een checkbox, minimaal 1 optie moet selecteren

PHOTO EMBED

Thu Jun 15 2023 11:29:57 GMT+0000 (Coordinated Universal Time)

Saved by @Amber

<form id="myForm">
  <label>
    <input type="checkbox" name="option" value="option1"> Optie 1
  </label>
  <label>
    <input type="checkbox" name="option" value="option2"> Optie 2
  </label>
  <label>
    <input type="checkbox" name="option" value="option3"> Optie 3
  </label>
  <button type="submit">Verzenden</button>
</form>

<script>
  const form = document.getElementById('myForm');
  const checkboxes = form.querySelectorAll('input[type="checkbox"][name="option"]');
  
  form.addEventListener('submit', function(event) {
    if (!isAtLeastOneChecked(checkboxes)) {
      event.preventDefault(); // Voorkom dat het formulier wordt verzonden
      alert('Selecteer minimaal één optie.');
    }
  });
  
  function isAtLeastOneChecked(checkboxes) {
    for (let i = 0; i < checkboxes.length; i++) {
      if (checkboxes[i].checked) {
        return true; // Er is minimaal één optie geselecteerd
      }
    }
    return false; // Er is geen optie geselecteerd
  }
</script>
content_copyCOPY

https://chat.openai.com/c/27bf8c3a-a183-4e84-aff6-85d425a92ab4