Estás en: Inicio >> Foros >> Informática >> Webmasters >> Desarrollo Web
Desarrollo Web /

[JAVASCRIPT] Problemita con SELECT OPTION

Participa en el tema [JAVASCRIPT] Problemita con SELECT OPTION en el foro Desarrollo Web.
Si yo tengo el siguiente formulario (es un fragmento nomás)...... Código:...

Buscar en este tema:
Búsqueda avanzada
Respuesta
 
  • desconectado

    • 2,728

      MENSAJES

     
    Kent Brockman escribió el 22/08/2006 a las 09:23 hs.
     
    ¿Mensaje inapropiado?
    #1 [JAVASCRIPT] Problemita con SELECT OPTION
    Si yo tengo el siguiente formulario (es un fragmento nomás)......


    Código:
     <form name="forma"> 
 
<select name="anotacion1" size="1">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4">nota4</option>
</select>

<select name="anotacion2" size="1">
<option value="nota1">nota1</option>
<option value="nota2">nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>
 
<input type="button" onclick="intercambiar();" value="Intercambiar valores">
 
</form>

    Como puedo hacer con javascript para intercambiar la selección entre ambos? es decir, que al presionar el boton intercambiar, quiero que el "anotacion1" tenga seleccionado el valor "nota4" y que "anotacion2" quede seleccionado con el valor "nota2", o sea que se autoseleccionen los valores que tiene el otro selector.

    No vale cambiarlos a mano con el mouse ni recargando la página. Se tiene que poder aplicar ahi mismo antes de submitir el formulario.

    Se me ocurre que a lo mejor puede hacerse con los selected index values, pero tengo la cabeza quemada y no lo resuelvo.

    Quien me ayuda?

    Responder a este tema

    Citar

    +
     
    0
    Me gusta
     
    http://www.psicofxp.com/forums/desarrollo-web.264/375122-javascript-problemita-con-select-option.html
    | Más
  • desconectado

    • 509

      MENSAJES

    JmN escribió el 22/08/2006 a las 10:12 hs. ¿Mensaje inapropiado?

    #2 Re: Problemita con SELECT OPTION

    Como bien decis... tenes que usar el indice del select: selectedIndex... quedaria algo asi:
    document.formulario.select.selectedIndex;
    Con eso tenes la posicion selecionada del select, luego lo guardas en una variable "temporal" y lo cambias.

    Slds

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 2,728

      MENSAJES

    Kent Brockman escribió el 23/08/2006 a las 00:07 hs. ¿Mensaje inapropiado?

    #3 Re: Problemita con SELECT OPTION

    Originalmente publicado por JmN
    Como bien decis... tenes que usar el indice del select: selectedIndex... quedaria algo asi:
    document.formulario.select.selectedIndex;
    Con eso tenes la posicion selecionada del select, luego lo guardas en una variable "temporal" y lo cambias.

    Slds

    si si, todo muy lindo, pero no se como hacer que se asigne el valor de una variable a la seleccion de un selector....
    Como asigno el valor de la variable temporal al otro selector. Eso es lo que no entiendo.


    Código:
     
<script> 
function intercambiar(){
var seleccion1=document.forma.anotacion1;
var seleccion2=document.forma.anotacion2;
 
var temp1=seleccion1.options[seleccion1.selectedIndex].value;
alert(temp1);  // acá ya tengo el dato del 1

}
</script>

<form name="forma">
<select name="anotacion1" size="1">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4">nota4</option>
</select>
<select name="anotacion2" size="1">
<option value="nota1">nota1</option>
<option value="nota2">nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>
<input type="button" onclick="intercambiar();" value="Intercambiar valores">
</form>

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 509

      MENSAJES

    JmN escribió el 23/08/2006 a las 10:50 hs. ¿Mensaje inapropiado?

    #4 Re: Problemita con SELECT OPTION

    Y ya lo tenes... era cuestion de probar un poco mas...
    Ahora hace lo que hiciste pero con la segunda, y despues asignaselas, invertidas, a la propiedad...
    no es necesario que lo uses asi como lo pusiste, usalo simplemente con document.formulario.select.selectedIndex; y accede y seteala ahi (estarias seteando la posicion (un numero) en vez del value, pero es lo mismo...)

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 2,728

      MENSAJES

    Kent Brockman escribió el 23/08/2006 a las 22:06 hs. ¿Mensaje inapropiado?

    #5 Re: Problemita con SELECT OPTION

    Originalmente publicado por JmN
    Y ya lo tenes... era cuestion de probar un poco mas...
    Ahora hace lo que hiciste pero con la segunda, y despues asignaselas, invertidas, a la propiedad...
    no es necesario que lo uses asi como lo pusiste, usalo simplemente con document.formulario.select.selectedIndex; y accede y seteala ahi (estarias seteando la posicion (un numero) en vez del value, pero es lo mismo...)

    Bueno, a pesar de lo críptica de tu respuesta, era cuestión como decías, de dedicarle unos minutos mas de tiempo y si, IT FUCKING WORKS!!!!!!


    Código:
     <html> 
<script>
function intercambiar(){
var seleccion1=document.forma.anotacion1;
var seleccion2=document.forma.anotacion2;
var variabletemporal = seleccion1.selectedIndex;
seleccion1.selectedIndex= seleccion2.selectedIndex;
seleccion2.selectedIndex= variabletemporal;
}
</script>

<form name="forma">
<select name="anotacion1" size="1">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4">nota4</option>
</select>
<select name="anotacion2" size="1">
<option value="nota1">nota1</option>
<option value="nota2">nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>
<input type="button" onclick="intercambiar();" value="Intercambiar valores">
</form>
</html>

    quedó joyita!
    Ahora bien, ya lo tengo resuelto en javascript. Esto es solo la punta de un asqueroso iceberg, ya que es para un formulario de conjuntos de datos dinámicos, o sea que en una misma page ponele tenes varios grupos de datos (5 o 6 grupos de 4 o 5 selectores de notas a elegir como en el ejemplo, con 40 o 50 opciones cada caso) y el tema es que se puedan mover arriba o abajo entre los selectores de cada grupo. Asi que ahora el php que levanta los datos de la db tiene que tambien construir y escribir funciones en javascript para cada caso, de modo que los "paquetes" de selecciones puedan moverse arriba o hacia abajo de un grupo a otro. A cocinar código!

    Por cierto, gracias master!!!

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 2,728

      MENSAJES

    Kent Brockman escribió el 01/09/2006 a las 12:07 hs. ¿Mensaje inapropiado?

    #6 Re: Problemita con SELECT OPTION

    Bien, y si tengo un input de texto, simplemente copio el .value y listo.... joya, pero ahora tengo otro problemón: necesito intercambiar también entre selectores multiples.


    Código:
     
<select multiple name="anotacion3" size="6">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>
 
 
<select multiple name="anotacion4" size="6">
<option value="nota1" selected>nota1</option>
<option value="nota2">nota2</option>
<option value="nota3" selected>nota3</option>
<option value="nota4">nota4</option>
</select>

    Como hago para copiar los items a una variable? se usa un loop for con una matriz? como sería?

    Saludos!

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 2,728

      MENSAJES

    Kent Brockman escribió el 10/09/2006 a las 20:36 hs. ¿Mensaje inapropiado?

    #7 Re: Problemita con SELECT OPTION

    che, nadie sabe? por ahi me estoy ahogando en una chapita de Coca, pero me estoy ahogando, alguien que tire una punta....

    Responder

    Citar

    Me gusta este mensaje
  • desconectado

    • 2,728

      MENSAJES

    Kent Brockman escribió el 14/09/2006 a las 09:17 hs. ¿Mensaje inapropiado?

    #8 Re: Problemita con SELECT OPTION

    SOLUCIONADO! Soy un capo, modestia aparte. Funciona el script perfectamente bien! ahora también soportando multiples dropdowns. Es compatible con IE y FF.

    Les muestro el código para aquel que le sirva!

    Código:
     <html> 
<script>
function intercambiar(seleccion1,seleccion2){
// Levanto el array del origen
  var PrimerArray=new Array();
  var i=count=0;
  for(i=0; i<seleccion1.options.length;i++){
	  PrimerArray[count]=seleccion1.options[i].selected;count++;
  }
  
// Copio el array a un contenedor  
  var ArrayContenedor = new Array();
  ArrayContenedor = PrimerArray;
  //alert(ArrayContenedor)
// Levanto el array del target
  var SegundoArray=new Array();
  var i=count=0;
  for(i=0; i<seleccion2.options.length;i++){
	  SegundoArray[count]=seleccion2.options[i].selected;count++;
  }
// Switcheo los arrays
PrimerArray=SegundoArray;
SegundoArray=ArrayContenedor
// Asigno cada array a su selector:
// sel1 con el Primer Array
  var i=count=0;
  for(i=0; i<seleccion1.options.length;i++){
	  seleccion1.options[i].selected=PrimerArray[count];count++;
  }
// sel2 con el Segundo Array
  var i=count=0;
  for(i=0; i<seleccion2.options.length;i++){
	  seleccion2.options[i].selected=SegundoArray[count];count++;
  }
// Todos felices!
}
</script>

<form name="forma">
<select name="anotacion1" size="1">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4">nota4</option>
</select>
<select name="anotacion2" size="1">
<option value="nota1">nota1</option>
<option value="nota2">nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>
<br><br>
<select multiple name="anotacion3" size="6">
<option value="nota1">nota1</option>
<option value="nota2" selected>nota2</option>
<option value="nota3">nota3</option>
<option value="nota4" selected>nota4</option>
</select>

<select multiple name="anotacion4" size="6">
<option value="nota1" selected>nota1</option>
<option value="nota2">nota2</option>
<option value="nota3" selected>nota3</option>
<option value="nota4" selected>nota4</option>
</select>

<br><br>
<input type="button" onclick="
intercambiar(document.forma.anotacion1,document.forma.anotacion2);
intercambiar(document.forma.anotacion3,document.forma.anotacion4);
" value="Intercambiar valores">

</form>
</html>

    Gracias JmN por las pistas. El resto lo deduje leyendo los tutos de mredkj.com

    Saludos gente!

    Responder

    Citar

    Me gusta este mensaje
Estás en: Inicio >> Foros >> Informática >> Webmasters >> Desarrollo Web


Estadísticas del tema
  • 7 RESPUESTAS
  • 8318 VISTAS
  • 2 USUARIOS RESPONDIERON
 
Ir arriba
Contacto | Acerca de | Ayuda | Términos Legales | privacidad | Pautas de convivencia | Mapa de los foros | TrabajÁ con nosotros
©2008 Psicofxp.com S.A. - Todos los derechos reservados
Certifica IAB