https://www.daniel-moquet.fr/funnel-rdv/public/js/controle_champ_front.js

1const messagesArea = document.querySelector('[data-interact="funnel-messages"]');
2const inputBesoins = document.querySelectorAll('[data-watch="checkboxNeed"]');
3const submitButtonStep1 = document.querySelector('[data-interact="btn-submit-step-1"]');
4const nb_checked = () => {
5  return Array.from(inputBesoins).filter( _ => _.checked ).length;
6}
7let nbNeedChecked = nb_checked();
8
9window.addEventListener('DOMContentLoaded', ev => {
10  if(inputBesoins.length > 0 && submitButtonStep1){
11    // #########################################################################
12    // STEP 1 -- Tracking des besoins cochés
13    Array.from(inputBesoins).map(ib => ib.addEventListener('change', e => {
14      (e.currentTarget.checked)? nbNeedChecked++ : nbNeedChecked--;
15      if(nbNeedChecked >= 1){
16        messagesArea.innerHTML = "";
17      }
18      submitButtonStep1.dataset.checked = nbNeedChecked.toString();
19    }));
20
21    const robotField = document.getElementById('street');
22    // STEP 1 -- AU MOINS UN BESOIN COCHÉ
23    submitButtonStep1.addEventListener('click', e => {
24      if(robotField.value !== "") {
25        e.preventDefault();
26        messagesArea.innerHTML = layout_message('Merci de ne pas renseigner le champ street', 'error');
27      }
28      if(nbNeedChecked === 0){
29        messagesArea.innerHTML = layout_message('Merci de sélectionner au moins un projet', 'error');
30      }
31    })
32  }
33})
34