Probleme Javascript avec IE7

Résolu

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

A voir également:

Probleme Javascript avec IE7
Telecharger javascript - Télécharger - Langages
A javascript error occurred in the main process - Forum Handicap / Accessibilté
Erreur #125 javascript - Forum Mozilla Firefox
Afficher un tableau javascript en html ✓ - Forum Javascript
Javascript arrondi - Forum Javascript

12 réponses

Réponse 1 / 12

numerosix

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.

l_epais Messages postés 140 Date d'inscription Statut Membre Dernière intervention 31

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>

Réponse 2 / 12

warlix Messages postés 1201 Date d'inscription Statut Contributeur Dernière intervention 288

salut

pas sur de moi mais un </form> aprés le body , normal?

Réponse 3 / 12

RAD ZONE Messages postés 5230 Date d'inscription Statut Contributeur Dernière intervention 1 360

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

Réponse 4 / 12

slayer418

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?

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

Posez votre question

Réponse 5 / 12

Serge_La Messages postés 407 Date d'inscription Statut Membre Dernière intervention 47

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?

Réponse 6 / 12

slayer418

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.

Bhaa

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

Réponse 7 / 12

Serge_La Messages postés 407 Date d'inscription Statut Membre Dernière intervention 47

Je suis sceptique de la réponse de Bhaa. Si name et id sont identiques, il ne devrait pas y avoir problème.

Serge.

Réponse 8 / 12

anonymos

j'ai le meme problèm

Réponse 9 / 12

bg62 Messages postés 23731 Date d'inscription Statut Modérateur Dernière intervention 2 409

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

Réponse 10 / 12

Stritchy

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.

Réponse 11 / 12

Lechatpotte

En effet cela marche très bien ! ;)

yasmimi

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

yasmimi > yasmimi

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'].'"';}?> "/>

yasmimi > yasmimi

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!

yasmimi > yasmimi

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

Réponse 12 / 12

nEm3sis Messages postés 710 Date d'inscription Statut Membre Dernière intervention 113

certaines fonction change quand tu passe de firefox a IE ca doi etre ca
bon dsl de pas dire plus mais jvai dormir

Discussions similaires

java script error in the main process

Javascript Arrondi à 2 chiffres après la virgule

javascript:void(0);

Faire un echo dans un script JS

a javascript error occurred in the main process

Votre réponse

Discussions similaires