Salut Pierrick,
Merci pour ta réponse.
Seulement, j'utilise deux select qui se vide et remplisse dynamiquement.
Je te glisse mon code, peux-tu me dire stp comment faire un sorte que le "12" et le "0" (respectivement, le nombre de données dans la liste de gauche et de droite) changent dès que l'on modifie l'une des deux listes.
Merci beaucoup par avance.
<HTML>
<HEAD>
<TITLE>Select</TITLE>
<script type="text/javascript">
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function retirer() //~~ retirer de l'autre select ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{ if ( sel3.selectedIndex >=0 )
{ saisie.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;
supprime(); } }
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
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 deplace(sens) //~~ déplacer une ligne ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{ if (sel.selectedIndex+sens>=0 && sel.selectedIndex+sens<sel.length)
{ var t=sel[sel.selectedIndex+sens].text;
sel[sel.selectedIndex+sens].text=sel[sel.selectedIndex].text;
sel[sel.selectedIndex].text=t;
sel.selectedIndex=sel.selectedIndex+sens; } }
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function ajout(appel) //~~ ajout d'un ligne ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{ var adr;
switch (appel) {
case 0: //__ en tête __
adr=0;
break;
case 1: //__ avant __
if (sel.selectedIndex<0) return;
adr=sel.selectedIndex;
break;
case 2: //__ après __
if (sel.selectedIndex<0) return;
adr=sel.selectedIndex+1;
break;
case 3: //__ en fin __
adr=sel.length;
break;
case 4: //__ par ordre alphabétique __
position(saisie.value);
adr=sel.selectedIndex;
break; }
sel.length++;
for (var n=sel.length-1;n>adr;n--)
{ sel[n].text=sel[n-1].text; }
sel[adr].text=saisie.value;
sel.selectedIndex=adr;
sel2.length++;
sel2[sel2.length-1].text=sel2.length;
sel2.selectedIndex=adr; }
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function chgt(avant,apres,zone) //~~ remplacer caractères génants ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{ var reg=new RegExp(avant,"g");
return zone.replace(reg,apres); }
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
function position(rch) //~~ rechercher ~~
//~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
{ var tmp=rch.toLowerCase();
tmp=chgt("[àäâ]","a",tmp); // les accents posent
tmp=chgt("[éèêë]","e",tmp); // un problème de
tmp=chgt("[ïî]","i",tmp); // classement : en ASCII
tmp=chgt("[ôö]","o",tmp); // ils sont "après" la lettre
tmp=chgt("[ùûü]","u",tmp); // "z". le moins et l'espace
tmp=chgt("[- ]","",tmp); // sont ignorés.
var pos;
for (var n=0;n<sel.length;n++)
{ pos=sel[n].text.toLowerCase();
pos=chgt("[àäâ]","a",pos);
pos=chgt("[éèêë]","e",pos);
pos=chgt("[ïî]","i",pos);
pos=chgt("[ôö]","o",pos);
pos=chgt("[ùûü]","u",pos);
pos=chgt("[- ]","",pos);
if ( pos >= tmp )
{ sel.selectedIndex=n;
n=sel.length; } } }
</script>
</HEAD>
<BODY>
<form name="test">
<input type="hidden" name="saisie" id="saisie">
<center>Rechercher <input type="text" name="rech" onkeyup="position(this.value);"><br><br>
<table>
<tr>
<td>
<select name="sel" id="sel" onclick="choix(this);" onchange="choix(this);" size="10" style="width: 180px;">
<option>Société Générale</option>
<option>BNP Paribs</option>
<option>Crédit Agricole</option>
<option>Crédit Lyonnais</option>
<option>Banque Populaire</option>
<option>Caisse d'Epargne</option>
<option>Barclays</option>
<option>ABN Amro</option>
<option>JP Morgan</option>
<option>Goldman Sachs</option>
<option>Merril Lynch</option>
<option>Morgan Stanley</option>
</select>
<br>12 donnée(s)
<script type="text/javascript">
var sel=document.getElementById("sel");
var saisie=document.getElementById("saisie");
</script>
</select>
</td>
<td>
<input type="button" value=">>" onclick="ajouter();"><br><br>
<input type="button" value="<<" onclick="retirer();">
</td>
<td>
<select name="sel3" id="sel3" size="10" style="width: 180px;"></select>
<br>0 donnée(s)
<SCRIPT LANGUAGE="JavaScript">
var sel3=document.getElementById("sel3");
</SCRIPT>
</td>
</tr>
</table>
</form>
<SCRIPT LANGUAGE="JavaScript">
alert( "Il y a " + document.getElementById("sel").options.length + " options ;-)") ;
</SCRIPT>
</center>
</BODY>
</HTML>
|