gestion des select en html et JS

**om.kichou** · 03/08/2008, 02h32

Bonjour à tous,
en fait j'ai fait un script en html et JS qui permet de choisir dans un Select les options qu'on veux et les mettre dans un autre Select. mon probleme c'est que je ne sais pas comment faire pour que les options selectionnées vont etre conservé apres la fermeture de la page.
voici le script de la page :
__________________________________

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
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<HTML>
<HEAD>
 
<TITLE> Fonctions sur Select </TITLE>
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript" src="settings.js"></script>
<script type="text/javascript">
var settings = new lpSettings(lpSettings.COOKIE_URL, lpSettings.COOKIE_EXPIRATION);
</script>
 
<style  TYPE="text/css">
button 
		{ cursor:pointer;
			background-color:#FFFFDD;
			font-family:Verdana;
			width:100;
			font-size:11px;
			font-weight:bold;  }
label	
		{  cursor:default;
			color:#800040;
			font-family:Verdana;
			font-size:11px;
			text-decoration: underline;
			font-weight:bold;   }
select
		{  color:#400040;
			background-color:#00F0F0;
			font-family:Verdana;
			font-size:11px;
			font-weight:bold;   }
input 
		{  color:#400040;
			border:0;
			width:250;
			height:14;
			background-color:#F0F000;
			font-family:Verdana;
			font-size:9px;
			font-weight:bold;   }
</style>
<script type="text/javascript"><!--------
 
 
 
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function retirer()  //~~ retirer de l'autre select ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{  if ( sel3.selectedIndex >=0 )
	{	sel3.value=sel3[sel3.selectedIndex].text;
		{	for (var n=sel3.selectedIndex;n<sel3.length-1;n++)
			{	sel3[n].text=sel3[n+1].text; 	}
			sel3.length--;  
		}
		ajout(4);
	}  
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function ajouter()  //~~ transférer vers autre select ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{	if ( sel.selectedIndex >=0 )
	{	sel3.length++;
		sel3[sel3.length-1].text=sel[sel.selectedIndex].text;
		sel3[sel3.length-1].value=sel[sel.selectedIndex].value;
 
	}
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function choix(liste)  //~~ choix d'une ligne ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{  saisie.value=liste[liste.selectedIndex].text;
	var i=liste.selectedIndex;
	sel.selectedIndex=i;
	sel2.selectedIndex=i;    
}
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function supprime() //~~ suppression d'une ligne ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{	if (sel.selectedIndex>=0)
	{	for (var n=sel.selectedIndex;n<sel.length-1;n++)
      { 	sel[n].text=sel[n+1].text; 	}
		sel.length--;
		sel2.length--;  
	}  
}
function ChangeExo1(sel3){
 
	if (sel3.selectedIndex != 0){
 
		window.parent.bas.location.href =sel3.options[sel3.selectedIndex].value;
 
 
	}else{
 
		alert('Veuillez choisir un widgets.');
 
	}
 
}
 
fAffiche = function()
{
 document.getElementById('sel1').style.visibility = "visible";
 
}
fHide = function()
{
 document.getElementById('sel1').style.visibility = "hidden";
 
}
 
//--------></script>
</HEAD>
<!--==================================================-->
<BODY>
<b><div id ="sel1">
<center>
<select  name="sel" id="sel"
			onclick="choix(this);"
			onchange="choix(this);"
			>
  <option SELECTED VALUE="">----- Liste des widgets disponibles-----</option>
        <option value="doctissimo.htm">Tout sur la santé avec doctissimo</option>
        <option value="CNRS.htm">Les dernières nouvelles de CNRS </option>
        <option value="dailymotion.htm">Les dernières video sur dailymotion</option>
        <option value="euronews.htm">L'actualité sur euronews</option>
        <option value="eurosport.htm">L'actualité sportive sur eurosport</option>
        <option value="france24.htm">L'actualité sur france24</option>
        <option value="jeuxvideo.htm">Les nouveautés sur les jeux video</option>
        <option value="mediadico.htm">Lrouver toutes les definitions</option>
        <option value="michelin.htm">Trouver votre itineraire</option>
         <option value="nouvelobs.htm">News scientifiques sur nouvelobservateur</option>
         <option value="pagejaune.htm">Trouver une adresse sur pages jaunes</option>
         <option value="sport_fr.htm">Le sport sur sport.fr</option>
         <option value="technoscience.htm">Techno-science.net</option>
         <option value="youtube.htm">Vos video sur youtube</option>
 
</select>
<button onclick="ajouter();">Ajouter</button><br />
</div>
<center>
<select	name="sel3"
			id="sel3"
			onclick="choix(this);"
			onchange="ChangeExo1(this);">
			<option SELECTED VALUE="">---------Liste des widgets choisies --------</option>
</select>
<button onclick="retirer();">Retirer</button><br><button onclick="javascript:fAffiche();">Valider
</button>
<button onclick="javascript:fHide();">Valider2</button>
</center>
 
</BODY>
</HTML>

__________________________________________
s'il y a quelqu'un qui à une idée ça sera une aide précieuse pour moi.
merci d'avance

**Sub0** · 04/08/2008, 09h53

Salut!

Tu peux utiliser les cookies en Javascript pour stocker les informations.
http://javascript.developpez.com/faq...=navig#cookies

Ensuite, il faut positionner le "selected" au bon endroit dans la liste des options...
http://javascript.developpez.com/faq...amps#valSelect

**laurentibus** · 04/08/2008, 11h05

Si par fermeture de la page tu entends fermeture de l explorateur : alors fais comme t as dit Sub0

si tu entend par fermeture changement de page alors un simple formulaire, ou passage de paramètres suffise, ou encore la méthode de Sub0

++

**om.kichou** · 05/08/2008, 01h24

bonjour;
desolé mais si vous avez regarder le script vous remarquez que j'ai essayer de faire un cookie par contre je n'arrive pas à faire un script pour récupérer dans un cookie les options que j'ai rajouté dans le deuxième select . et quand je recharge la page il faut que je trouve les options que j'ai rajouté.
si quelqu'un peut m'aider ça sera gentil de sa part.

gestion des select en html et JS

JavaScript

Discussions similaires

Partager

Partager