Probleme Javascript avec IE7

Résolu/Fermé
slayer418 - 4 nov. 2007 à 20:28
 yasmimi - 9 nov. 2009 à 14:02
Bonjour,
J'ai un probleme coté javascript avec IE7, j'ai une page html avec une fonction nommé cacher()
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Carnet de Stage</title>
<script language="JavaScript" src="js/heure.js"></script>
<script type="text/javascript" src="fckeditor/fckeditor.js"></script>
<script type="text/javascript">
function cacher()
{
document.getElementById("divgr").style.visibility='hidden'
document.getElementById("div" + document.getElementById("groupe").value).style.visibility='visible'
}
</script>
</head>
<body onLoad="getDt();">

<form name="form1" action="send.php" method="POST" target="_parent">
<center><br><input type="hidden" id="url" name="url">
<div id="divgr" name="divgr" style="visibility : visible;">
Groupe:      
<br>
<select id="groupe" name="groupe">
<option value="Aucun" selected >Selectionner Groupe</option> 
<option value="gr102" onclick="cacher()">102</option>
 <option value="gr103" onClick="cacher()">103</option>
 <option value="gr104" onClick="cacher()">104</option>
<option value="gr105" onClick="cacher()">105</option>
</select>
</div>
<div id="divgr102" name="divgr102" style="visibility : hidden;">
Élève:      
<br>
<select id="eleve_gr102" name="eleve_gr102">
<option value="Aucun" selected >Selectionner Nom</option> 
<option value="RaphaelG" onSelect="">Raphael Gagné</option>
 <option value="gr103" onSelect="">103</option>
 <option value="gr104" onClick="">104</option>
<option value="gr105" onSelect="">105</option>
</select>
</div>
mot de passe <br>(pour pouvoir modifier):</br><input type="password" id="password" name="password">
<br><br>Prénom:  <input id="prenom" name="prenom" size="16">
<br><br>Fiche:     <input id="fiche" name="fiche" size="14">
<br><br>Image:    <input id="image" name="image" value="http://">
<br><br>Date:      <input name="date" id="date" value ="">
  <BR><BR>Texte:     
	
</head>

	<body>

		<table cellpadding="0" cellspacing="0" border="0">
			<tr>
				<td>
					Choisiser un theme visuels : 

				</td>
				<td>
			<select id="cmbSkins" onchange="ChangeSkin(this.value);">
				<option value="default">Default</option>
				<option value="office2003" selected="selected">Office 2003</option>
				<option value="silver">Silver</option>
			</select>
		</td>
	</tr>
</table>
<br>
<div><input type="hidden" id="FCKeditor1" name="FCKeditor1" style="display:none" /><input type="hidden" id="FCKeditor1___Config" value="CustomConfigurationsPath=/fckeditor.config.js&SkinPath=/fckeditor/editor/skins/office2003/&PreloadImages=/fckeditor/editor/skins/office2003/images/toolbar.start.gif;/fckeditor/editor/skins/office2003/images/toolbar.end.gif;/fckeditor/editor/skins/office2003/images/toolbar.bg.gif;/fckeditor/editor/skins/office2003/images/toolbar.buttonarrow.gif;" style="display:none" /><iframe id="FCKeditor1___Frame" src="/fckeditor/editor/fckeditor.html?InstanceName=FCKeditor1&Toolbar=Default" width="100%" height="500" frameborder="0" scrolling="no"></iframe></div>
<br>
<br>
<input name="Submit" value="Envoyer" type="submit" onClick="if(document.form1.groupe.value == 'Aucun') {javascript:alert('Vous n\'avez pas choisis de groupe.'); return false;} if(document.form1.image.value == 'http://') {document.form1.image.value = 'Aucune image'} if(document.form1.url.value == '') {document.form1.url.value = 'http://slayer418.no-ip.info/ || http://slayer418.no-ip.info/index.html'} if(document.form1.nom.value =='') {javascript:alert('Vous avez oublier de remplire le champ Nom'); return false;} else if(document.form1.password.value =='') {javascript:alert('Vous avez oublier de remplire le champ mot de passe'); return false;} if(document.form1.prenom.value =='') {javascript:alert('Vous avez oublier de remplire le champ Prénom'); return false;}"></center>
 </select>
</form>
</body>
</form>
</html>


Le probleme est qu'avec firefox 2.* ma fonction fait ce quel doit faire et qu'avec IE7 ca marche pas , pourquoi?

12 réponses

Stritchy bonjour,

Il faut passer par l'evenement onchange du select.

la solution dans ton cas, c'est probablement d'ajouter un facteur a ta fonction. Exemple:

<select onchange="javascript:mafonction(this.value);" name="nomselect">
<option value="<?php echo $mavaleur1; ?>" ><?php echo $monoption1; ?></option>
<option value="<?php echo $mavaleur2; ?>" ><?php echo $monoption2; ?></option>
</select>

(je pars de l'hypothèse que ta boucle est en php, mais ca marcherait pareil avec asp, ou boucle en javascript avec document.write

J'espere que ca pourra aider

bye.
1
l_epais Messages postés 140 Date d'inscription vendredi 24 août 2007 Statut Membre Dernière intervention 12 août 2010 31
27 févr. 2009 à 13:53
Salut tout le monde, un moyen plus simple de résoudre le problème est exposé ici
[ https://www.daniweb.com/programming/web-development/threads/115562/javascript-onclick-is-not-working-in-ie7-ie6]
en gros: on utilise un eval de la value, (ça fait moins de modif)

<select>
<option onclick="my javascript"></option>
<option onclick="my javascript"></option>
<option onclick="my javascript"></option>
</select>
devient
<select onchange="eval(this.value);">
<option value="my javascript"></option>
<option value="my javascript"></option>
<option value="my javascript"></option>
</select>
0
warlix Messages postés 1201 Date d'inscription mercredi 25 juillet 2007 Statut Contributeur Dernière intervention 21 février 2009 288
4 nov. 2007 à 22:42
salut


pas sur de moi mais un </form> aprés le body , normal?
0
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
4 nov. 2007 à 22:50
loool
pourquoi pas !! il y as bien un deuxieme </head> et<body> en plein millieu de la page ;-))

attention quand tu fais du copie / colle !!!!

RAD
0
Bonjour,
Vos réponse ne mon pas vraiment aider,

<code><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Carnet de Stage</title>
<script language="JavaScript" src="js/heure.js"></script>
<script type="text/javascript" src="fckeditor/fckeditor.js"></script>
<script type="text/javascript">
function cacher()
{
document.getElementById("divgr").style.visibility='hidden'
document.getElementById("div" + document.getElementById("groupe").value).style.visibility='visible'
}
</script>
</head>
<body onLoad="getDt();">

<form name="form1" action="send.php" method="POST" target="_parent">
<center><br><input type="hidden" id="url" name="url">
<div id="divgr" name="divgr" style="visibility : visible;">
Groupe:      
<br>
<select id="groupe" name="groupe">
<option value="Aucun" selected >Selectionner Groupe</option>
<option value="gr102" onclick="cacher()">102</option>
<option value="gr103" onClick="cacher()">103</option>
<option value="gr104" onClick="cacher()">104</option>
<option value="gr105" onClick="cacher()">105</option>
</select>
</div>
<div id="divgr102" name="divgr102" style="visibility : hidden;">
Élève:      
<br>
<select id="eleve_gr102" name="eleve_gr102">
<option value="Aucun" selected >Selectionner Nom</option>
<option value="RaphaelG" onSelect="">Raphael Gagné</option>
<option value="gr103" onSelect="">103</option>
<option value="gr104" onClick="">104</option>
<option value="gr105" onSelect="">105</option>
</select>
</div>
mot de passe <br>(pour pouvoir modifier):</br><input type="password" id="password" name="password">
<br><br>Prénom:  <input id="prenom" name="prenom" size="16">
<br><br>Fiche:     <input id="fiche" name="fiche" size="14">
<br><br>Image:    <input id="image" name="image" value="http://">
<br><br>Date:      <input name="date" id="date" value ="">
  <BR><BR>Texte:     

</body>


<body>

<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
Choisiser un theme visuels : 

</td>
<td>
<select id="cmbSkins" onchange="ChangeSkin(this.value);">
<option value="default">Default</option>
<option value="office2003" selected="selected">Office 2003</option>
<option value="silver">Silver</option>
</select>
</td>
</tr>
</table>
<br>
<div><input type="hidden" id="FCKeditor1" name="FCKeditor1" style="display:none" /><input type="hidden" id="FCKeditor1___Config" value="CustomConfigurationsPath=/fckeditor.config.js&SkinPath=/fckeditor/editor/skins/office2003/&PreloadImages=/fckeditor/editor/skins/office2003/images/toolbar.start.gif;/fckeditor/editor/skins/office2003/images/toolbar.end.gif;/fckeditor/editor/skins/office2003/images/toolbar.bg.gif;/fckeditor/editor/skins/office2003/images/toolbar.buttonarrow.gif;" style="display:none" /><iframe id="FCKeditor1___Frame" src="/fckeditor/editor/fckeditor.html?InstanceName=FCKeditor1&Toolbar=Default" width="100%" height="500" frameborder="0" scrolling="no"></iframe></div>
<br>
<br>
<input name="Submit" value="Envoyer" type="submit" onClick="if(document.form1.groupe.value == 'Aucun') {javascript:alert('Vous n\'avez pas choisis de groupe.'); return false;} if(document.form1.image.value == 'http://') {document.form1.image.value = 'Aucune image'} if(document.form1.url.value == '') {document.form1.url.value = 'http://slayer418.no-ip.info/ || http://slayer418.no-ip.info/index.html'} if(document.form1.nom.value =='') {javascript:alert('Vous avez oublier de remplire le champ Nom'); return false;} else if(document.form1.password.value =='') {javascript:alert('Vous avez oublier de remplire le champ mot de passe'); return false;} if(document.form1.prenom.value =='') {javascript:alert('Vous avez oublier de remplire le champ Prénom'); return false;}"></center>
</select>
</body>
</form>
</html>code>

Ca marche toujours seulement sur Firefox mais pourquoi?
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Serge_La Messages postés 407 Date d'inscription lundi 19 mars 2007 Statut Membre Dernière intervention 3 mars 2009 47
5 nov. 2007 à 02:13
bonsoir,
où est ton erreur? Quelle fonction ne marche pas? Est-ce cacher()? Sur cette ligne:
document.getElementById("div" + document.getElementById("groupe").value).style.visibility='visible'

il semble y avoir un problème. Le + fait quoi?
0
Bonjour,
Le + est suposé aditionner div avec la valeur du select avec l'id groupe et la fin est suposé le rend visible puisqu'il est hidden
.style.visibility='visible'


Se script marche avec Firefox mais il faudrait plus trouver avant pourquoi
document.getElementById("divgr").style.visibility='hidden' 
ne cache pas le le div avec l'id divgr.

Ne regarder pas mon premier post avec le code , il contient vraiment des erreurs , regarder mon troisième post , il contient le bon code.
0
la solution
getElementById sur firefox ne recherche que dans les ID
getElementById sur IE recherche dans les ID ET dans les attributs NAME

getElementById est censé retrouner qu'un seul résultat (puisqu'un ID est censé etre unique)
Hors dans ton code, ta balise a et un ID et un Name identique, ton getElementById retourne donc 2 objet au lieu d'un (ce qui explique pourquoi sous ie sa fonctionne pas)

la solution, soit tu vire les name (qui ne sont utile que pour des formulaires), soit tu fait en sorte que les name et les id n'ai jamais la même valeure
0
Serge_La Messages postés 407 Date d'inscription lundi 19 mars 2007 Statut Membre Dernière intervention 3 mars 2009 47
24 avril 2008 à 17:45
Je suis sceptique de la réponse de Bhaa. Si name et id sont identiques, il ne devrait pas y avoir problème.

Serge.
0
j'ai le meme problèm
0
bg62 Messages postés 23664 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 17 décembre 2024 2 392
1 juil. 2008 à 18:47
bonjour
ne reste pas 'anonyme', je sais il n'est pas obligatoire de s'inscrire,
mais c'est quand même plus respectueux vis-à-vis de ceux qui essaieront
de t'apporter des solutions ...
@+
b g
0
Il semblerait que l'événement "onClick" ne soit pas géré par IE sur les "<option>", j'ai le même problème la solution serait d'exécuter ta fonction dans le "onChange" du select directement en testant la valeur de celui ci. Mais malheureusement ca ne marche pas pour moi car mes options sont dynamiques (boucle) et la valeur passé à ma fonction est calculé dans cette boucle, si je mes ma fonction sur le onchange su select je ne connais plus ces valeurs calculées.
0
En effet cela marche très bien ! ;)
0
Effectivement ça marche,
j'avais le même problème avec IE (toujours celui là).

Sauf qu'étant donnée qu'on donne une valeur a l'attribut value de notre option, lorsqu'on envoie le formulaire, la variable $_POST['notreSelect'] a pour valeur le code javascript et plus ce qu'il y avait entre les balises html.
Ma liste déroulante a 4 options, deux cachent un élèment, les deux autres le font apparaître. Donc elles possèdent deux à deux le même code JS, et donc la même value, donc quand j'envoie mon formulaire, je ne peux pas réutiliser la valeur de la liste sélectionnée par l'utilisateur, alors que je dois l'afficher!

Comment faire, il me faut soit une autre solution pour contrer l'absence d'interprétation du onclick sur les options dans IE, ou un moyen de récupérer la valeur de la liste sélectionnée par mon user!!!

Any idea?

Meci d'avance
0
yasmimi > yasmimi
9 nov. 2009 à 11:31
Bon je réponds à mon propre post, j'ai trouvé la solution, mais c vraiment loin d'être propre, on peut même dire que c'est le bordel!

En fait, initialement dans mon script les variables POST sont stockées dans des SESSIONS car je les réutilise dans plusieurs page (notamment sur la page du formulaire pour que mes utilisateurs n'aient pas à tout retaper), j'ai donc crée une autre variable SESSION qui comprend le texte de ma liste qui est ma VRAIE valeur mais qui avec votre solution (qui marhce) est remplacé par du code JS!

donc voilà mon premier code initial qui marchait qu'avec firefox et pas IE


<select name="justif" id="justif">

<option  
onclick="javascript: toggleVisibilityChoix('gainEstime', 'hidden') ; toggleVisibilityChoix('gainEstimeLabel', 'hidden')" <?php if($_SESSION['justifreal']=='Nouveau procédé'){echo ' selected';}?>>Nouveau procédé
</option>

<option  
onclick="javascript: toggleVisibilityChoix('gainEstime', 'hidden') ; toggleVisibilityChoix('gainEstimeLabel', 'hidden')" <?php if($_SESSION['justifreal']=='Risque sécurité et environnement'){echo ' selected';}?>>Risque sécurité et environnement
</option>

<option 
onclick="javascript: toggleVisibilityChoix('gainEstime', 'visible') ; toggleVisibilityChoix('gainEstimeLabel', 'visible')" <?php if($_SESSION['justifreal']=='Réduction non qualité'){echo ' selected';}?>>Réduction non qualité
</option>

<option 
onclick="javascript: toggleVisibilityChoix('gainEstime', 'visible') ; toggleVisibilityChoix('gainEstimeLabel', 'visible')" <?php if($_SESSION['justifreal']=='Amélioration au poste'){echo ' selected';}?>>Amélioration au poste
</option>

</select> 

<label id="gainEstimeLabel">gain estimé : </label>
<input type="text" name="gainEstime" id="gainEstime" <?php if(!empty($_SESSION['gainEstime'])){echo ' value="'.$_SESSION['gainEstime'].'"';}?> 
"/>


et mon code final:

<select name="justif" id="justif" onclick="eval(this.value)">
<option 
value="toggleVisibilityChoix('gainEstime', 'hidden') ; toggleVisibilityChoix('gainEstimeLabel', 'hidden') ; <?php $_SESSION['justifreal']='Nouveau procédé';?>"
<?php if($_SESSION['justifreal']=='Nouveau procédé'){echo ' selected';}?>>
Nouveau procédé
</option>

<option  value="toggleVisibilityChoix('gainEstime', 'hidden') ;  toggleVisibilityChoix('gainEstimeLabel', 'hidden') ; <?php $_SESSION['justifreal']='Risque sécurité et environnement';?>"
<?php if($_SESSION['justifreal']=='Risque sécurité et environnement'){echo ' selected';}?>>
Risque sécurité et environnement
</option>

<option  value="toggleVisibilityChoix('gainEstime', 'visible') ; toggleVisibilityChoix('gainEstimeLabel', 'visible'); <?php $_SESSION['justifreal']='Réduction non qualité';?>"
<?php if($_SESSION['justifreal']=='Réduction non qualité'){echo ' selected';}?>>
Réduction non qualité
</option>

<option value="toggleVisibilityChoix('gainEstime', 'visible') ; toggleVisibilityChoix('gainEstimeLabel', 'visible'); <?php $_SESSION['justifreal']='Amélioration au poste';?>"
<?php if($_SESSION['justifreal']=='Amélioration au poste'){echo ' selected';}?>>
Amélioration au poste
</option>

</select> 

<label id="gainEstimeLabel">gain estimé : </label>
<input type="text" name="gainEstime" id="gainEstime" <?php if(!empty($_SESSION['gainEstime'])){echo ' value="'.$_SESSION['gainEstime'].'"';}?> "/>
0
yasmimi > yasmimi
9 nov. 2009 à 13:27
Vous allez me pourrir,
mon code ne marche pas!

bah oui! j'essaye de modifier une variable php alors que la page est déjà chargé,donc forcément elle ne se modifie pas! JS n'est pas ajax bien qu'il en fasse partie!
Bon je donne ma solution dès que je l'ai;

Yasmimi, ou comment discuter seule sur un forum!
0
yasmimi > yasmimi
9 nov. 2009 à 14:02
Donc voilà problème vraiment résolu grâce à un champ caché qui change de value grâce au javascript: pas besoin de AJAX.

<input type="hidden" id="caracDTreal" name="caracDTreal"/>


et dans mes fonctions JS:

document.getElementById("caracDTreal").value="Banc";
0
nEm3sis Messages postés 710 Date d'inscription lundi 20 août 2007 Statut Membre Dernière intervention 9 avril 2012 113
5 nov. 2007 à 01:06
certaines fonction change quand tu passe de firefox a IE ca doi etre ca
bon dsl de pas dire plus mais jvai dormir
-1