Discussion :

[cfabc]

Bonjour,
sur une fonction de vérification fonctionnant parfaitement sous IE J'ai un message d'erreur sous Chrome
le message est le suivant :
TypeError: Cannot read property 'style' of null 7

la fonction est en JS c'est tout simplement pour vérifier la validité d'un formulaire
voici la fonction :

Code :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
function verification(listeForm,mail,passverif){
 
	listeVerif = listeForm.split(",");
	listeVide = new Array();
	var t=0;
	var i = 0;
	var colorOrigine = "#FFFFFF";
	var colorSurligne = "#CCCCCC";
	for (i=0;i<listeVerif.length;i++){
		try{
		document.getElementById(listeVerif[i]).style.background=colorOrigine;
		}
		catch(e){
			alert(e + ' ' + i);
		}
	}
 
	for (i=0;i<listeVerif.length;i++){
		try{
			if(document.getElementById(listeVerif[i]).value.replace(/(^\s*)|(\s*$)/g,'')  == ""){
				listeVide[t] = listeVerif[i];
				t+=1;
			}		
		}
		catch(e){
			alert(e + ' ' + i);
		}
	}
	if(listeVide.length > 0){
		try{
				for (i=0;i<listeVide.length;i++){
					document.getElementById(listeVide[i]).style.background=colorSurligne;
				}
			alert("Les champs surlignés sont obligatoires");
			return false;
				}
		catch(e){
			alert(e + ' ' + i);
		}
	} 
 
	if(mail == "oui"){
		try{
			emailTest = document.getElementById("email").value;
			if(emailTest.indexOf("@") == "-1" || emailTest.indexOf(".") == "-1" || emailTest == "" ){
				document.getElementById("email").style.background=colorSurligne;
				alert("Adresse Email invalide.");			
				return false;
			}else{
				document.getElementById("email").style.background=colorOrigine;
			}
		}
		catch(e){
			alert(e + ' ' + i);
		}
	}
 
	if(passverif != "" && passverif != 0){
		verifPass = passverif.split(",");
		if (document.getElementById(verifPass[0]).value != document.getElementById(verifPass[1]).value){
			document.getElementById(verifPass[0]).style.background=colorSurligne;
			document.getElementById(verifPass[1]).style.background=colorSurligne;
			alert("La saisie des deux champs surlignés doivent etre identique");
			return false;
		}else{
			document.getElementById(verifPass[0]).style.background=colorOrigine;
			document.getElementById(verifPass[1]).style.background=colorOrigine;
		}
	}	
 
	return true;
}

Je ne suis pas le seul à rencontrer ce pb mais je n'est pas trouvé de solution...

[E.Bzz]

Bonjour et bienvenue sur Developpez.com

Sais-tu sur laquelle des lignes ça bloque ?

Est-ce bien des id que tu passes à ta fonction (si tu n'as défini que des name, le getElementById() fonctionnera sous IE mais pas ailleurs).

A+

[cfabc]

A la question "Sais-tu sur laquelle des lignes ça bloque ?"
Je crois que c'est sur la ligne :
document.getElementById(listeVerif[i]).style.background=colorOrigine;
Cela ne bloque pas vraiment
je m'explique, au lancement de la fonction verification()
J'ai une alerte Chrome "TypeError: Cannot read property 'style' of null 7"
je click sur OK
et après tout fonctionne parfaitement

Je n'ai pas ce message sous EI

A la question "Est-ce bien des id que tu passes à ta fonction"
???

A+

[cfabc]

Je viens de trouver mon bug,

Dans la listeVerif il y avait un champ en plus qui n'était pas testé dans la fonction verification()
le for (i=0;i<listeVerif.length;i++)
allait donc trop loing et envoyait à la fonction
document.getElementById(listeVerif[i])
un champ name nom valide
pas de pb sur IE mais message sous Chrome

Merci pour ton aide

[E.Bzz]

A la question "Est-ce bien des id que tu passes à ta fonction" ???

allait donc trop loing et envoyait à la fonction
document.getElementById(listeVerif[i]) un champ name nom valide

C'est de cette confusion là dont je parlais

A+

[grenoult]

Bonjour,

Je profite de cette discussion (car le deuxième résultat lors de la recherche sur Google de "cannot read property 'style' of null") pour dire que j'ai eu le même problème.

En effet, Chrome ne pouvait pas toucher au setStyle d'un élément qu'il considérait comme null. Pourtant, il n'était pas null car en faisant un alert juste avant, il me renvoyait bien le type de l'élément (un div dans mon cas).

C'est avec Firebug, sous FF, qu'il m'a annoncé d'où venait plus exactement l'erreur. Dans le setStyle je spécifiait un "top" et un "left" par des variables qui étaient vides ou inexistantes.

Pour conclure il faut faire attention à ce que disent les consoles des navigateurs et ne pas hésiter à les comparer avec d'autres.