[Syntaxe]rafraichir une liste avec internet explorer

Version imprimable

Bonjour tout le monde,
j'ai 2 pages HTML suivante :
index.html :
Code:

1 2 3 4 5 6 7 8 9 <form name="monform"> <select name="choix" id="choix"> <option value="rabat">rabat</option> <option value="paris">paris</option> <option value="berlin">berlin</option> </select> <input type="button" value="new" onClick="window.open('popup.html','ajouter_ville','width=200,height=200')"> </form>
ajout.html :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <script language="javascript"> function refreshPage(newValue){ var w = window.opener.document.getElementById('choix'); var content = w.innerHTML; content += '<option value="' + newValue + '">' + newValue + '</option>'; w.innerHTML = content; } </script> <form name="form"> ville <input type="text" name="ville" onBlur="refreshPage(this.value)"> <input type="button" value="ok" onClick="self.close();"> </form>
mon problème est que sous internet explorer la liste n'est pas affichée, elle est toute vide.
j'ai tester le même script sous Mozilla Firefox et Opera et il fonctionne bien.
pourquoi ça ne marche pas avec IE ? est ce qu'il y'a un autre moyen pour le faire fonctionner correctemet avec IE.

Merci d'avance

23/02/2007, 18h13
Auteur
bonjour,

on ne créé pas une option avec innerHTML.
cf. http://sergep.developpez.com/tutorie...ge=page_5#LV-B
Puis regarde le paragraphe V-B-2-b où est expliqué comment est créé un select et ses options et le paragraphe V-B-2-c où est expliqué l'insertion d'une option dans la liste.
Code:

1 2 3 4 5 6 var elOption = new Option("Option", "valeur", false, false); var elSelect= document.getElemenById("idSelect"); //Ajout dans le select de l'option elSelect.options.add(elOption);
23/02/2007, 19h09
achos

Merci bien pour la réponse et pour l'article.
je vais essayé de modifier mon script et on verra ce que ça donne.
:king:
24/02/2007, 11h33
Auteur

Citation:

Envoyé par achos

Merci bien pour la réponse et pour l'article.
je vais essayé de modifier mon script et on verra ce que ça donne.
:king:

tiens moi au courant ;)
26/02/2007, 11h51
achos

j'ai essayé avec ce script mais ca ne donne rien.
j'ai pas bien compris comment ça fonctionne, je veux juste savoir quel est le problème de mon script cité auparavent avec le navigateur internet explorer.

Je me suis appuyé sur ces exemples pour ton script
http://www.developpez.net/forums/sho...d.php?t=271424

Dans un premier temps, j'accèdais à ta liste (getElementById()) dans une fonction de la pop-up et je la mettais à jour. L'ennui est que cela faisait planter IE. J'ai donc procédé autrement :

Dans la pop-up j'appelle la fonction ajouterVille() où je récupère la valeur de l'input.

Puis j'appelle la fonction ajouter() contenue dans index.html et à qui je transmets le nom de la ville et dans laquelle je mets à jour la liste. Du coup, j'accède à la liste des ville non plus à partir de la pop-up mais à partir de la fenêtre "opener".

J'ai donc refait ton code :
index.html

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
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
var chargeOk = "false";
 
function ouvreFille()
{
 if (chargeOk=="false")  //pour vérifier que la pop-up a été ouverte
     window.open('popup.htm','ajouter_ville','width=400,height=200,status=yes');
}
 
function ajouter(ville)
{
  var liste = document.getElementById("choix");
  var elOption = new Option(ville, ville, false, false);
 
  //Ajout dans le select de l'option
  liste.options.add(elOption);
  alert(ville+" a été ajoutée à la liste");
 
}
//-->
</script>
 
</head>
 
<body>
<form id="monform">
 
  <select id="choix">
  <option value="rabat">rabat</option>
  <option value="paris">paris</option>
  <option value="berlin">berlin</option>
  </select>
 
  <input type="button" value="new" onclick="ouvreFille()">
 
</form>
 
</body>
 
</html>

popup.html

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
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
function charge()
{
 //on confime a la fenetre mere que la pop-up est ouverte
 window.opener.chargeOk = "true";
}
function decharge()
{
 //on confime a la fenetre mere que la pop-up est fermee
 window.opener.chargeOk = "false";
}
 
function ajouterVille()
{
  var ville = document.getElementById("idText").value;
  //on transmet a la fonction ajouter() de la fenetre mere le nom de la ville
  window.opener.ajouter(ville);
}
 
function fermer()
{
 window.close();
}
 
//-->
</script>
 
 
</head>
 
<body onload="charge()" onunload="decharge()">
 
Nom de la ville à ajouter&nbsp;:
<input type="text" value="" id="idText" size="40">
<br><br>
<input type="button" value="Ajouter" onclick="ajouterVille()">
<input type="button" value="Fermer fenêtre" onclick="fermer()">
 
 
</body>
 
</html>

27/02/2007, 12h07
achos

Merci bcp pour votre réponse.
ça marche trés bien avec IE, je veux seulement savoir si je peut faire apparaitre la ville que j'ai ajouter comme option par défaut (selected=selected) lorsque je revient a ma page d'index.

Merci encore :king:

Citation:

Envoyé par achos

Merci bcp pour votre réponse.
ça marche trés bien avec IE, je veux seulement savoir si je peut faire apparaitre la ville que j'ai ajouter comme option par défaut (selected=selected) lorsque je revient a ma page d'index.

Merci encore :king:

Je savais que tu allais me demander ça :D

dans index.html : après l'insertion dans la liste, met l'option en "selected".
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function ajouter(ville) { var liste = document.getElementById("choix"); var elOption = new Option(ville, ville, false, false); //Ajout dans le select de l'option liste.options.add(elOption); //insertion de l'option elOption.selected = "selected"; //la selectionner ensuite alert(ville+" a été ajoutée à la liste"); }
Par contre, si il y a une option sélectionnée, je me demande si tu ne dois pas la déselectionner avant, et donc parcourir toute la liste et faire pour chaque option (j'ai un doute sur le code):
Code:

1 2 for (i=0; i<liste.options.length;i++) liste.options[i].selected="";

merci bien
:king:
té le meilleure
Et qu'est ce que vous pensez du script que j'ai envoyé sur l'autre forum.

et comment je peux ajouter l'option selected dans mon script.
Le voilà mon script =

index.html

Code:

1
2
3
4
5
6
7
8
9
10
11
 
<form name="f_ajout">
<label> Ville : 
	<select name="ville">
		<option value="rabat">rabat</option>
		<option value="rabat">paris</option>
		<option value="rabat">rome</option>
	</select>
</label>
<input type=button value="new" onClick="window.open('popup.html','ajouter_ville','width=200,height=200,top=200,left=300').focus();"><br>
</form>

popup.html

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
 
<html>
<head>
<title>Ajouter une ville</title>
<script language="javascript">
	function Valider(form){
		var bval = true;
 
			if (form.champ.value=="" && bval){
				alert('Veuillez saisir la ville');
				bval = false;
				form.champ.focus();
			}
 
			if (bval){
 
				var nouvelleOption = window.opener.document.createElement("option");
				  nouvelleOption.value = form.elements['champ'].value;
				  nouvelleOption.appendChild(window.opener.document.createTextNode(form.champ.value));
				  window.opener.document.forms["f_ajout"].ville.appendChild(nouvelleOption);
				} 
 
		return bval
	}
</script>
</head>
 
<body onLoad="document.f1.champ.focus();">
<form name="f1" onSubmit="return Valider(this);">
<h4>Ajouter une ville</h4>
<input type="text" name="champ">
<input type="submit" value="Enregistrer" onClick="self.close();">
</form>
</body>
</html>

merci infiniment

27/02/2007, 16h31
achos
j'ai trouvé il suffit juste d'ajouter :
Code:

1 2 nouvelleOption.selected = 'selected';
je me suis inspiré :mouarf: :aie: du script que vous m'avez donné merci bcp.
même si j'ai une option déjà sélectionnez par défaut, elle est remplacer par celle que je vient d'ajouter.
j'ai tester ce script avec IE et FF et il fonctionne à merveille.
:yaisse2:

:king: Thank you very much
27/02/2007, 16h35
E.Bzz

Citation:

Envoyé par achos

même si j'ai une option déjà sélectionnez par défaut, elle est remplacer par celle que je vient d'ajouter.

Tu es sûr que c'est pas juste le 1° "selected" qui est pris ?
En tous cas c'est le cas si tu le fais en dur (en HTML) ...

A+
27/02/2007, 16h49
achos

:salut:
avant d'appeler la popup j'ai une option "choisir" sélectionner par défaut (selected='selected').
aprés l'appel de la page popup et on ajoutant la nouvelle option je lui attribut la methode (selected='selected') et elle est automatiquement sélectionneé à la place de l'ancienne option qui est "choisir".
c'est comme ça que ça marche et je ne voit pas où se trouve le pb.
27/02/2007, 16h53
Auteur

Citation:

Envoyé par E.Bzz

Tu es sûr que c'est pas juste le 1° "selected" qui est pris ?
En tous cas c'est le cas si tu le fais en dur (en HTML) ...

A+

c'est pour ça que je lui proposait de "déselectionner" les autres options avant de faire un selected sur l'option ajoutée. Ceci dit, sa liste n'a pas l'attribut "multiple" donc a priori la dernière option sélectionnée annule la sélection de la précédente.
27/02/2007, 17h26
achos

Oui c'est tout à fait comme ça.
d'ailleur j'ai aucun pb et ca marche trés bien que ça soit IE ou FF

Merci:king: