Rechercher : dans
Par :

Probleme Javascript avec IE7

Dernière réponse le 9 nov 2009 à 14:02:15 slayer418, le 4 nov 2007 à 20:28:19 
 Signaler ce message aux modérateurs

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?
Configuration: Windows XP
Internet Explorer 7.0

Meilleures réponses pour « Probleme Javascript avec IE7 » dans :
Javascript - Manipulation des contrôles clavier VoirManipulation des contrôles clavier Cette astuce a pour but de vous faire découvrir la (ou du moins une) manière de contrôler les évènements clavier en javascript. Cela vous permettra de contrôler/attribuer les/des comportements particuliers à...
Javascript - Modifier la hauteur (height) d'un élément HTML VoirPour modifier la hauteur d'un élément HTML en javascript, il suffit d'utiliser sa propriété de style "height". Pour cela vous pouvez y faire référence de la manière suivante : Si vous souhaitez connaître la hauteur (height) d'un bloc HTML, il...
Popup en CSS, sans Javascript VoirVoici comment réaliser une popup d'information en pure CSS, sans Javascript. L'astuce est d'utiliser :hover de manière à utiliser des CSS différents au passage du curseur. Parmis les attributs CSS modifiés, on utilise display:none afin de...
Javascript - Les événements VoirQu'appelle-t-on un événement? Les événements sont des actions de l'utilisateur, qui vont pouvoir donner lieu à une interactivité. L'événement par excellence est le clic de souris, car c'est le seul que le HTML gère. Grâce au Javascript il est...
Javascript - Les variables VoirLe concept de variable Une variable est un objet repéré par son nom, pouvant contenir des données, qui pourront être modifiées lors de l'exécution du programme. En Javascript, les noms de variables peuvent être aussi long que l'on désire,...
Javascript - Introduction au langage Javascript VoirQu'est-ce que le Javascript? Le Javascript est un langage de script incorporé dans un document HTML. Historiquement il s'agit même du premier langage de script pour le Web. Ce langage est un langage de programmation qui permet d'apporter des...

1

warlix, le 4 nov 2007 à 22:42:05

Salut


pas sur de moi mais un </form> aprés le body , normal?
la tristesse c est de ne pas savoir que l on est heureux !

Répondre à warlix

2

RAD ZONE, le 4 nov 2007 à 22:50:21

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
♣ La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣

Répondre à RAD ZONE

3

slayer418, le 5 nov 2007 à 00:06:00

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?

Répondre à slayer418

4

nEm3sis, le 5 nov 2007 à 01:06:41

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

Répondre à nEm3sis

5

Serge_La, le 5 nov 2007 à 02:13:41

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épondre à Serge_La

6

slayer418, le 5 nov 2007 à 17:35:12

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.

Répondre à slayer418

7

Bhaa, le 24 avr 2008 à 17:15:05

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épondre à Bhaa

8

Serge_La, le 24 avr 2008 à 17:45:52

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épondre à Serge_La

9

anonymos, le 1 jui 2008 à 17:06:59

J'ai le meme problèm

Répondre à anonymos

10

bg62, le 1 jui 2008 à 18:47:23

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
le 'www' est fait aussi pour communiquer, partager et échanger, non ?

Répondre à bg62

11

Stritchy, le 13 aoû 2008 à 12:05:39

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épondre à Stritchy

12

numerosix, le 2 sep 2008 à 15:42:33
  • +1

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.

Répondre à numerosix

13

l_epais, le 27 fév 2009 à 13:53:13

Salut tout le monde, un moyen plus simple de résoudre le problème est exposé ici
[ http://www.daniweb.com/forums/thread115562.html]
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épondre à l_epais

14

Lechatpotte, le 11 aoû 2009 à 08:32:05

En effet cela marche très bien ! ;)

Répondre à Lechatpotte

15

yasmimi, le 9 nov 2009 à 10:56:01

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

Répondre à yasmimi

16

yasmimi, le 9 nov 2009 à 11:31:43

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

Répondre à yasmimi

17

yasmimi, le 9 nov 2009 à 13:27:12
  • +1

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!

Répondre à yasmimi

18

 yasmimi, le 9 nov 2009 à 14:02:15
  • +1

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épondre à yasmimi
Collection CommentÇaMarche.net