Script vérification cases à cocher

Version imprimable

Bonjour à tous,

Je me permets de poster car je finis par tourner en rond sur ce script qui ne marche pas.

Il est censé envoyer une alerte et un false si aucune case du formulaire n'est cochée.

Mais ca ne marche pas...:oops:

Quelqu'un voit-il le bug ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script language="JavaScript">/*<![CDATA[*/function checkquand() {
	var msg = "Vous n'avez pas tout rempli:\n\n";
 
var datesouhaiteecheck = 0;
for (i = 0; i < document.formulaire2.date.length; i++) {
	if (document.formulaire2.date[i].checked) { datesouhaiteecheck++;}
}
if (datesouhaiteecheck == 0) {
		msg += "Veuillez choisir votre creneau pour le rendez-vous.\n";
	} 
 
if (msg == "Vous n'avez pas tout rempli:\n\n") return(true);
	else	{
		alert(msg);
		return(false);
	}
}/*]]>*/</script>
<form action="[url]" name="formulaire2" method="post" onSubmit="return checkquand();">
<input type="checkbox" name="datesouhaitee[]" id="date" value="1540454374am"> dans la matin&eacute;e
<input type="checkbox" name="datesouhaitee[]" id="date" value="1540454374md"> entre midi et 2
<input type="checkbox" name="datesouhaitee[]" id="date" value="1540454374pm"> dans l'apr&egrave;s-midi
</form>

24/10/2018, 10h44
Showie

Bonjour,

J'ai testé ton code en ajoutant juste un bouton submit et le fonctionnement attendu est bien présent.

Est ce que tu as une erreur dans la console ? (un truc du genre ReferenceError: checkquand is not defined)

voici le JSFiddle

Bonjour,

plusieurs problèmes cependant :

id="date" : un id DOIT ETRE UNIQUE
onsubmit s'écrit en minuscules
<script language="JavaScript">/*<![CDATA[*/ : une syntaxe ancienne...

Une solution "propre" et simple :
1- on ajoute une classe "datesouhaitee" aux checkbox
2- on les entoure d'un <label> (ce qui permet de cocher la case en cliquant sur le texte)

Code:

1
2
3
4
5
6
7
<form action="[url]" name="formulaire2" method="post" onsubmit="return checkquand();">
  <label><input type="checkbox" name="datesouhaitee[]" class="datesouhaitee" value="1540454374am"> dans la matin&eacute;e</label>
  <label><input type="checkbox" name="datesouhaitee[]" class="datesouhaitee" value="1540454374md"> entre midi et 2</label>
  <label><input type="checkbox" name="datesouhaitee[]" class="datesouhaitee" value="1540454374pm"> dans l'apr&egrave;s-midi</label>
 
  <input type="submit" value="ok" />
</form>

3- on compte les checkbox cochées

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script>
'use strict';
function checkquand() 
{
  var msg_error = "Veuillez choisir votre creneau pour le rendez-vous.";
  var nbre_checkbox_checked = document.querySelectorAll('input.datesouhaitee:checked').length; // on compte les checkbox cochées
  if( nbre_checkbox_checked <= 0 )
  {
    alert( msg_error );
    return false;
  } else {
    return true;
  }
}</script>

24/10/2018, 10h52
dem273212

Citation:

Envoyé par Showie

Bonjour,

J'ai testé ton code en ajoutant juste un bouton submit et le fonctionnement attendu est bien présent.

Est ce que tu as une erreur dans la console ? (un truc du genre ReferenceError: checkquand is not defined)

Merci d'avoir pris le temps de répondre. Effectivement dans mon code original, il y a bien le submit.
Mais j'ai "relu" le code que j'ai envoyé avant de posté, je ne me suis même pas rendu compte que ce code marche.
En clair, j'ai corrigé en postant. Donc normal que ton test fonctionne.
Je viens de copier coller mon code dans mon script original et tout fonctionne.
Il y avait une bete erreur d'un caractère.
Je me suis corrigé tout seul en postant mais c'est toi qui me l'as fait remarquer #jevaisprendreuncafé :oops: :?
24/10/2018, 10h55
Invité

Merci de LIRE mon message précédent.
24/10/2018, 11h02
dem273212

Citation:

Envoyé par jreaux62

Merci de LIRE mon message précédent.

oh que oui ! Merci pour le "coup de propre".
Ma réponse précédente est partie pendant que tu rédigeais la tienne.
Merci encore !:)

Si tu as plusieurs tests dans la fonction, voici une façon d'afficher les messages d'erreur :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
'use strict';
function checkquand() {
  var msg_error = []; // array
  var nbre_checkbox_checked = document.querySelectorAll('input.datesouhaitee:checked').length;
  if( nbre_checkbox_checked <= 0 )
  {
    msg_error.push("- Veuillez choisir votre creneau pour le rendez-vous.");
  }
// ..... (autres tests)
  if( !(1==2) ) // test faux (exemple)
  {
    msg_error.push("- test faux.");
  }
// ..... (autres tests)
 
  if( msg_error.length > 0 )
  {
    msg_error = "Merci de corriger les erreurs :\n" + msg_error.join('\n'); // on regroupe les messages d erreur pour affichage en alert
    alert( msg_error );
    return false;
  } else {
    return true;
  }
}