IE pour controle champ obligatoire de genre input text

**lolymeupy** · 30/05/2008, 13h43

Bonjour,

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...

Est-ce que quelqu'un sait pourquoi ?

(voici mon code javascript :

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
 
 
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;      	
    }
}

)

**SpaceFrog** · 30/05/2008, 13h52

http://www.developpez.net/forums/sho...d.php?t=557868

**lolymeupy** · 30/05/2008, 14h15

Merci SpaceFrog !
Par contre, je peux pas vraiment tester car IE me fait un nouveau bug

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 ???

, parce que je suis perdu là ....

**SpaceFrog** · 30/05/2008, 14h29

on peut voir la balise html du form ? et celle du bouton submit ?

**lolymeupy** · 30/05/2008, 14h36

Voici la balise du Form :

Code :

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

<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

)

et mes submits :

Code :

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

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

**SpaceFrog** · 30/05/2008, 14h46

Code :

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

onsubmit="return valider_formulaire(this.form)

??

**lolymeupy** · 30/05/2008, 14h49

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...)

**SpaceFrog** · 30/05/2008, 14h54

peut être avec cette syntaxe ?

Code :

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

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

**lolymeupy** · 30/05/2008, 15h07

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

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
 
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à)

**SpaceFrog** · 30/05/2008, 15h22

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 !!!

**lolymeupy** · 30/05/2008, 15h28

Je viens de trouver d'où venait le bug

En fait ça vient du code html. Voilà comment c'était avant :
(juste un extrait de mon formulaire avec 1 des input text)

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
 
<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 :

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

value="

et juste avant :

Code :

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

" name

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

Code :

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

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

(...j'étais bien parti pour me prendre la tête tout le week-end la dessus...!)

IE pour controle champ obligatoire de genre input text

JavaScript

Discussions similaires

Partager

Partager