Discussion :

[moimp]

Bonjour,

Dans le code suivant, l'absence de données est correctement détectée (lignes 15 et 20) mais lorsque je renseigne le champ vide les valeurs des variables ne sont pas lues et les fonctions alert() continuent de renvoyer 'undefined'.

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
const	form1 		= document.getElementById('form1'),
	date_accueil	= document.getElementById('date_accueil'),
	typeOrigine	= document.getElementById('type_origine'),
	nomOrigine	= document.getElementById('nom_origine'),
	regexDate	= /[0-3][0-9].[0-1][0-9].(19|20)[0-9]{2}/;
 
form1.addEventListener('submit', function(e) {
	if (! regexDate.test(date_accueil.value)) {
		alert("La date d'accueil doit être au format 'JJ/MM/AAAA'.\nUtilisez de préférence le calendrier.");
		e.preventDefault();
	}
	alert(1 + typeOrigine.data);
	alert(2 + typeof typeOrigine.data);
	alert(3 + nomOrigine.data);
	alert(4 + typeof nomOrigine.data);
	if (typeof typeOrigine.data == 'undefined') {
		//alert("Le type et le nom d'origine du contact sont obligatoires.");
		//alert(typeOrigine.data);
		//e.preventDefault();
	}
	if (typeof nomOrigine.data == 'undefined') {
		//alert("Le type et le nom d'origine du contact sont obligatoires.");
		//alert(typeOrigine.data);
		//e.preventDefault();
	}
}, false);

Le contrôle de regex quant à lui fonctionne correctement.

[moimp]

Je me réponds à moi-même. J'ai utilisé data ou lieu de value.

[Watilin]

Salut, voici deux-trois conseils en vrac :

Pour déboguer, utilise console.log au lieu de alert. Les messages s’afficheront dans la console (F12) au lieu d’une popup, ce sera non bloquant, ça rend le débogage plus agréable. Bien sûr, pour les messages destinés aux utilisatrices et utilisateurs, continue à employer alert, ou mieux : injecte les messages dans le HTML de la page. Tu pourras entre autres ajouter des indications sémantiques (par exemple l’attribut aria-invalid) pour améliorer l’accesibilité de ta page.

Si tu es en mode strict, la valeur undefined ne peut pas être redéfinie, il n’y a donc aucun danger à l’utiliser pour les vérifications de « type ». Tu peux remplacer

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if (typeof typeOrigine.data == 'undefined') {

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if (typeOrigine.data === undefined) {

en faisant attention à bien utiliser le triple égal === qui fait des comparaisons strictes (voir opérateurs de comparaison). C’est plus efficace, et personnellement je trouve que c’est plus lisible.