placer l'element selectionné en haut de la liste

**titicurio** · 21/02/2006, 17h58

hello

dans une fonction je selectionne un élément dans une liste:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('liste').options[i].selected=true;

je voudrait que cet élément sélectionné se trouve en haut de la liste et non pas en bas comme c'est la cas.

c possible?

merci

**siddh** · 21/02/2006, 20h43

salut,
c'est possible mais il va falloir reorganiser ta liste avec le dom.
Renseigne toi sur removeChild et insertBefore.

**SpaceFrog** · 22/02/2006, 08h30

oui ou encore la methode à l'arrache...

mettre les items dans un array, trier l'array comme tu le veux et repeupler le select ...

**titicurio** · 22/02/2006, 09h12

dans mon cas c'est juste une question d'affichage
je ne veux pas réorganiser les elements de ma liste mais je veux juste faire en sorte que le scrolling soit suffisant pour que lon puisse voir les elemets en dessous de celui qui est selectionné

**SpaceFrog** · 22/02/2006, 10h28

ce n'est donc pas modifier l'ordre des elements dans la liste ?

**denisC** · 22/02/2006, 10h32

Envoyé par titicurio

dans mon cas c'est juste une question d'affichage
je ne veux pas réorganiser les elements de ma liste mais je veux juste faire en sorte que le scrolling soit suffisant pour que lon puisse voir les elemets en dessous de celui qui est selectionné

Tu peux préciser ce que tu souhaites faire?

Dans une liste déroulante, c'est à priori l'option selectionnée qui est visible, non?

**titicurio** · 22/02/2006, 10h42

pour etre un peu plus clair, j'ai une liste contenant disons 200 éléments triés en ordre alphabétique
j'ai une zone de texte qui permet à l'utilisateur de faire une recherche rapide dans la liste en tapant ce qu'il cherche.

le principe est donc que sur l'évenement onkeyup de mon input, je selectionne dans ma liste le premier element qui correspond à ce qui a été tapé par l'utilisateur. ça marche tres bien.

c'est juste que l'élément sélectionné dan sla liste se trouve la plupart du temps etre le dernier "visible" de la liste.
je voudrais donc que l'element selectionné se trouve "visuellement" vers le haut pour que l'utilisateur puisse voir les éléments qui suivent.

je pense que je peux faire un truc du genre faire une "fausse" selection d'un element+10 et revenir sur la selection de mon element.

**SpaceFrog** · 22/02/2006, 10h46

ben en principe même selectionné dynamiquement l'item se colle en haut de la liste tout seul ..

tu selectionnes comment ?

**titicurio** · 22/02/2006, 10h48

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('liste').options[i].selected=true;

**SpaceFrog** · 22/02/2006, 10h50

essaye avec:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('liste').selectedItem=i;

**titicurio** · 22/02/2006, 11h14

ça marche pas mais je m'en sort en faisant ce que je disais

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
document.getElementById('liste').options[i+8].selected=true;
document.getElementById('liste').options[i].selected=true;

il suffit que je teste avant que je ne suis pas en fin de liste

merci quand meme

**SpaceFrog** · 22/02/2006, 11h26

Tiens je me suis amuse à le coder dyn,amiquement :

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
<script type='text/javascript'>
function selectedvisible(index){
 
var Obj=document.getElementById('sel')
if(index>Obj.options.length-1){return false;}
if(index+Obj.size<Obj.options.length){
			Obj.selectedIndex=index+Obj.size;
			Obj.selectedIndex=index;
			}
else{Obj.selectedIndex=Obj.options.length-Obj.size;
 		Obj.selectedIndex=index;}
 
}
</script>
</head>
 
<body>
<select id='sel' size=10 >
<script type='text/javascript'>
for(i=0; i<100;i++){document.write("<option>"+i+"</option>");}
</script>
</select>
<input type='text' id="item" />
<input type="button" onclick="selectedvisible(document.getElementById('item').value)" value="selection"/>
 
</script>
 
</html>

placer l'element selectionné en haut de la liste

JavaScript

Discussions similaires

Partager

Partager