IE pour controle champ obligatoire de genre input text

Version imprimable

Bonjour, :P
j'ai un problème avec IE sur un controle de champs obligatoires dans un formulaire.
En gros, je test 4 champs qui doivent être obligatoirement remplis. Si c'est pas le cas, ma fonction fait apparaitre des messages au dessus des champs.
J'ai 2 texteareas et 2 input text. Sous Mozilla, aucun problème; par contre sous IE, seul les messages au dessus des textareas apparaissent, et pas les messages au dessus des input text...8O

Est-ce que quelqu'un sait pourquoi ?

(voici mon code javascript :

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
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
 
 
function valider_formulaire(thisForm)
{
	var retour=0;
 
//je fais disparaitre ts les msg d'erreurs avant de refaire le controle du formulaire :
 
	document.getElementById("lbl_msg_titre").style.display = "none";
	document.getElementById("lbl_msg_descriptif").style.display = "none";
	document.getElementById("lbl_msg_lieu").style.display = "none";
	document.getElementById("lbl_msg_tarif").style.display = "none";
 
    // tarif_evt : textarea
    if(thisForm.tarif_evt.value == '')
    {
         document.getElementById("lbl_msg_tarif").style.display = "inline";
         thisForm.tarif_evt.focus();
         retour=retour+1;
    }
 
    // tarif_evt : input text
    if(thisForm.lieu_evt.value == '')
    {
         document.getElementById("lbl_msg_lieu").style.display = "inline";
         thisForm.lieu_evt.focus();
         retour=retour+1;
    }
 
    // tarif_evt : textarea
    if(thisForm.descriptif_evt.value == '')
    {
    	 document.getElementById("lbl_msg_descriptif").style.display = "inline";
         thisForm.descriptif_evt.focus();
         retour=retour+1;
    }
 
    // tarif_evt : input text
    if(thisForm.titre_evt.value == '')
    {
    	 document.getElementById("lbl_msg_titre").style.display = "inline";
         thisForm.titre_evt.focus();
         retour=retour+1;
    }
 
    if(retour>0)
    {
    	return false;
    }
    else
    {
	return true;      	
    }
}

)

30/05/2008, 13h52
SpaceFrog

http://www.developpez.net/forums/sho...d.php?t=557868
30/05/2008, 14h15
lolymeupy

Merci SpaceFrog !
Par contre, je peux pas vraiment tester car IE me fait un nouveau bug :evilred:
Il valide le controle (alors que les champs ne sont pas remplis) car quand je valide, il met des blancs dans les champs...
J'explique : j'ai des compteurs (en js aussi) de nombre de caractères pour chaque champ, et quand je valide, je vois qu'un champ qu'il rajoute des dizaines de caractères dans les champs (des blancs)
Par exemple, j'ai un compteur décroissant qui est initialement à 60, et quand je valide il est passé à 10 ???? (en gros, il m'a rajouté 50 caractères blancs dans mon champs)
Résultat, le controle en js n'est plus valable !!!
Et je comprend pas du tout pourquoi ???

(précision importante, il fait ça que dans les champs input text !!!)
Pourquoi il plante sur les champs input text des qu'il s'agit de javascript ???
:help:, parce que je suis perdu là ....
30/05/2008, 14h29
SpaceFrog

on peut voir la balise html du form ? et celle du bouton submit ?
30/05/2008, 14h36
lolymeupy
Voici la balise du Form :

Code:

<form enctype="multipart/form-data" name="form_enreg" action="enregistrement-evenement.php" method="post" onsubmit="return valider_formulaire(this)">

(la fonction js "return valider_formulaire(this)" est appellée, et si ok (et seulement ok), on passe au script "enregistrement-evenement.php". Seulement, là, il y passe quand même alors que les champs ne sont pas remplis (pas par moi en tout cas:evilred:)

et mes submits :
Code:

1 2 3 <input type="submit" name="Valider" value="Valider" id="valider" class="submit"/> <input type="submit" name="Previsualiser" value="Previsualiser" id="previsualiser" class="submit"/>
J'ai 2 submit (un pour prévisualiser au cas où...Mais le résultat est le même que je clique sur l'un ou l'autre des boutons...)

Merci pour ton aide spacefrog;)
30/05/2008, 14h46
SpaceFrog

Code:

onsubmit="return valider_formulaire(this.form)

??
30/05/2008, 14h49
lolymeupy

J'ai remplacé "this" par "this.form" mais ça ne change rien malheureusement...
Il passe toujours au script enregistrement-evenement.php quand même (et continu de rajouter des caracteres dans les input text...)
30/05/2008, 14h54
SpaceFrog

peut être avec cette syntaxe ?

Code:

thisForm.elements['lieu_evt'].value.length == 0

En fait, je viens de rechanger tout mon code de ma fonction de controle js (en suivant ton lien précédent) :

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
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
 
function valider_formulaire()
{
	var retour=0;
 
//je fais disparaitre ts les msg d'erreurs avant de refaire le controle du formulaire :
 
	document.getElementById("lbl_msg_titre").style.display = "none";
	document.getElementById("lbl_msg_descriptif").style.display = "none";
	document.getElementById("lbl_msg_lieu").style.display = "none";
        document.getElementById("lbl_msg_tarif").style.display = "none";
 
    if(document.forms['form_enreg'].elements['tarif_evt'].value=='')
    {
         document.getElementById("lbl_msg_tarif").style.display = "inline";
         //thisForm.tarif_evt.focus();
         retour=retour+1;
    }
 
    if(document.forms['form_enreg'].elements['lieu_evt'].value=='')
     {
         document.getElementById("lbl_msg_lieu").style.display = "inline";
         //thisForm.lieu_evt.focus();
         retour=retour+1;
    }
 
    if(document.forms['form_enreg'].elements['descriptif_evt'].value=='')
    {
    	 document.getElementById("lbl_msg_descriptif").style.display = "inline";
         //thisForm.descriptif_evt.focus();
         retour=retour+1;
    }
 
 
    if(document.forms['form_enreg'].elements['titre_evt'].value=='')
    {
    	 document.getElementById("lbl_msg_titre").style.display = "inline";
         //thisForm.titre_evt.focus();
         retour=retour+1;
    }
 
 
    if(retour>0)
    {
    	return false;
    }
    else
    {
		return true;      	
    }
}

et ça marche comme ça...
Le seul problème, c'est quand j'arrive sur la page (ou quand je l'actualise) il me rajoute des caractères dans mes champs input...Ce qui fait que les mesages d'erreurs "champs obligatoires" s'affichent bien pour les textarea mais par pour les input text...
Donc ça progresse, mais y'a toujours ce bug ..???

(et merci pour le lien, ça a bien amélioré le truc déjà)

30/05/2008, 15h22
SpaceFrog

Citation:

Le seul problème, c'est quand j'arrive sur la page (ou quand je l'actualise) il me rajoute des caractères dans mes champs input...

c'est que tu dois avoir une fonction qui mets des trucs dedans !
un input ne se remplit pas tout seul !!!

Je viens de trouver d'où venait le bug :marteau:
En fait ça vient du code html. Voilà comment c'était avant :
(juste un extrait de mon formulaire avec 1 des input text)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<tr valign=bottom><td></td><td><label id="lbl_msg_titre" style="display:none" class="lbl_msg">* champ obligatoire</label></td></tr>
<tr valign=top>
<td><label for="titre">Titre évènement: *<br/><FONT SIZE="1"><I>( max. 60 caractères )</I></FONT></label></td>
<td><input type="text" maxlength="60" size="51" value="
<?php 
if (isset($_SESSION['titre_evt'])) {echo $_SESSION['titre_evt'];}
?>
" name="titre_evt" id="titre_evt" class="inptxt_form"><br /></td>
<td valign="top"><label id="controle_decompte_titre" name="controle_decompte_titre" class="lbl_controle_decompte" value=""></label>
<script language="Javascript" type="text/javascript"> 
LimiterTextArea('titre_evt', 60, 'controle_decompte_titre');
</script></td>
</tr>
<tr class="hauteur_ligne1"></tr>

et le problème, se sont les sauts à la ligne pour le code php juste après :

Code:

value="

et juste avant :

Code:

" name

Il prend ça pour des tabs...
Donc en virant ces espaces, ça marche :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<tr valign=bottom><td></td><td><label id="lbl_msg_titre" style="display:none" class="lbl_msg">* champ obligatoire</label></td></tr>
<tr valign=top>
<td><label for="titre">Titre évènement: *<br/><FONT SIZE="1"><I>( max. 60 caractères )</I></FONT></label></td>
<td><input type="text" maxlength="60" size="51" value="<?php 
if (isset($_SESSION['titre_evt'])) {echo $_SESSION['titre_evt'];}
?>" name="titre_evt" id="titre_evt" class="inptxt_form"><br /></td>
<td valign="top"><label id="controle_decompte_titre" name="controle_decompte_titre" class="lbl_controle_decompte" value=""></label>
<script language="Javascript" type="text/javascript"> 
LimiterTextArea('titre_evt', 60, 'controle_decompte_titre');
</script></td>
</tr>
<tr class="hauteur_ligne1"></tr>

Je te remercie vraiment pour ton aide spacefrog :king:
(...j'étais bien parti pour me prendre la tête tout le week-end la dessus...!)