Elementos de Lista

engllp · #1 (**permalink**) 24/06/2003, 10:22

Como puedo hacer para mover 1 elemento de una lista haciendo click en alguno de los dos botones. Por ejemplo Tengo una lista con 2 botones a la derecha de la lista(Flecha arriba y flecha abajo)¿Como puedo hacer cuando haga click en el boton de Flecha arriba el elemento seleccionado suba 1 elemento hacia arribab y de la misma forma suceda coon el botn Flecha Abajo?

Saludos,

LLP

JavierB · #2 (**permalink**) 24/06/2003, 11:35

Hola, engllp.

Prueba este código:

Código PHP:

  <html>

<head>

<script>

function arriba() {

    obj=document.getElementById('sel');

    indice=obj.selectedIndex;

    if (indice>0) cambiar(obj,indice,indice-1);

}

function cambiar(obj,num1,num2) {

    proVal=obj.options[num1].value;

    proTex=obj.options[num1].text;

    obj.options[num1].value=obj.options[num2].value;    

    obj.options[num1].text=obj.options[num2].text;    

    obj.options[num2].value=proVal;

    obj.options[num2].text=proTex;

}

</script>

</head>

 
<body bgcolor="#FFFFFF" text="#000000">

<select id="sel" size="5">

<option value="1">Uno</option>

<option value="2">Dos</option>

<option value="3">Tres</option>

</select>

<input type="button" value="Arriba" onClick="arriba()">

</body>

</html>

Habrás visto que solo tiene un botón para ir hacia arriba. Lo de ir hacia abajo creo que no te costará mucho trabajo hacerlo. Si tienes algún problema dilo y te ayudo.

Saludos,

unKnown · #3 (**permalink**) 24/06/2003, 14:23

Dos pequeñas modificasiones

Código PHP:

  function arriba() {

    obj=document.getElementById('sel');

    indice=obj.selectedIndex;

    if (indice>0) cambiar(obj,indice,indice-1);

}

function abajo(){

    obj=document.getElementById('sel');

    indice=obj.selectedIndex;

    if (indice<obj.length-1) cambiar(obj,indice,indice+1);

}

function cambiar(obj,num1,num2) {

    proVal=obj.options[num1].value;

    proTex=obj.options[num1].text;

    obj.options[num1].value=obj.options[num2].value;    

    obj.options[num1].text=obj.options[num2].text;    

    obj.options[num2].value=proVal;

    obj.options[num2].text=proTex;

    obj.selectedIndex=num2;

}

para que funcione para abajo tambien y para que no cambie la seleccion

unKnown · #4 (**permalink**) 24/06/2003, 14:27

claro con su boton

<input type="button" value="Arriba" onClick="abajo()">

JavierB · #5 (**permalink**) 25/06/2003, 01:56

Hola, unKnown.

Lo de la función abajo no hice por pura pereza

Lo de mantener la selección me di cuenta cuando estaba a punto de irme a cenar y, oye, la cena es la cena. Gracias por tu aportación, pero voy a proponer una modificación (toma rima)

function abajo(){
obj=document.getElementById('sel');
indice=obj.selectedIndex;
if (indice<obj.length-1 && indice!=-1) cambiar(obj,indice,indice+1);

Es para que si no hay nada seleccionado no cambie nada.

Saludos,

unKnown · #6 (**permalink**) 25/06/2003, 13:03

por supuesto la cena es la cena