Selects dependientes

sirchote · #1 (**permalink**) 21/11/2011, 15:41

Saludos

Soy aun bastante novato, y quisiera saber, como puedo hacer lo siguiente:

En un formulario de una pagina, quiero poner 4 selects, cuyas opciones se vean reducidas a las distintas que haya seleccionadas en las otras.

Tengo 4 selects con 8 opciones. Quiero de entrada, al estar vacíos, mire el que mire, se vean las 8 opciones, pero que a la que en algún momento seleccione una opción en uno de los selects, el resto ya no la muestren

Es posible?

Gracias

ofertasdiarias · #2 (**permalink**) 21/11/2011, 16:23

fijate en este sitio web [URL="http://www.formatoweb.com.ar/ajax/select_dependientes_3_niveles.php"]http://www.formatoweb.com.ar/ajax/select_dependientes_3_niveles.php[/URL]

Kaopectate · #3 (**permalink**) 21/11/2011, 16:49

Hola sirchote.

Yo creo que lo que buscas se resuelve con JavaScript o Ajax.

Date una vuelta por el foro de JavaScript y entra en los FAQs (uno de los tres primeros hilos del foro) y vas a encontrar mas de un ejemplo.

Suerte.

sirchote · #4 (**permalink**) 21/11/2011, 16:50

gracias por la rapidez

he estado ojeando lo que me has mandado, pero el problema que veo, es que si cambio A, B deja de ser valido.

quiza no he explicado del todo bien lo que quería hacer

quiero poner 4 selects, A, B, C y D
sus valores por defecto, son 4 de los 8 disponibles en una tabla

A, tiene valor 1
B, tiene valor 2
C, tiene valor 3
D, tiene valor 4

Los valores 5, 6, 7 y 8, no estan asignados a ningun select.

con la configuración anterior:

si desplegamos los posibles valores de A, serían 1 ( el suyo ), 5, 6, 7 y 8
si desplegamos los posibles valores de B, serían 2 ( el suyo ), 5, 6, 7 y 8

ahora, selecciono con B, el valor 6

si desplegamos los posibles valores de A, serían 1 ( el suyo ), 2, 5, 7 y 8

creo que ahora lo he explicado mejor, lo que no se si es posible hacerlo

gracias

Kaopectate · #5 (**permalink**) 21/11/2011, 17:00

¿Como si fuese un loto?

sirchote · #6 (**permalink**) 21/11/2011, 17:02

Cita:

Iniciado por Kaopectate

¿Como si fuese un loto?

disculpame, pero no entiendo la pregunta

Kaopectate · #7 (**permalink**) 21/11/2011, 17:23

Jeje, ok.

El loto es un tipo de lotería en la que los números salen en cierto órden. Pero no te preocupes, te estoy preparando un ejemplo y ya me dirás si te entendí o no.

Saludos.

Kaopectate · #8 (**permalink**) 21/11/2011, 17:51

Prueba esto y me dices. Espero que te sirva porque me tengo que ir, asi que no voy a poder ver tu respuesta hasta dentro de unas horas. Suerte.

Código PHP:

  <html> 
 <head> 
  <script language='JavaScript'> 
 
   var  
    aNumeros = new Array(1, 2, 3, 4, 5, 6, 7, 8); 
    aValores = new Array(5, 2, 1, 4); 
 
   function addOption(oCntrl, iPos, sTxt, sVal){ 
    var oOption = new Option(sTxt, sVal); 
    oCntrl.options[iPos] = oOption; 
   } 
 
   function esValido(iControl, nVal){ 
    var bRes = true; 
    for (var i = 0; i < aValores.length; i++) 
     if (i != iControl) 
      bRes = bRes && (aValores[i] != nVal); 
    return bRes; 
   } 
 
   function preasigna(){ 
    for (var i = 1; i <= 4; i++){ 
     oSel = document.getElementById('s' + i); 
     while (oSel.length) 
      oSel.remove(0); 
     for (var j = 0, p = 0; j < aNumeros.length; j++){ 
      if (esValido(i - 1, aNumeros[j])) 
       addOption(oSel, p++, aNumeros[j], aNumeros[j]);  
     } 
     oSel.value = aValores[i - 1]; 
    } 
   } 
 
   function recalcula(oSel, nSel){ 
    aValores[nSel - 1] = oSel.value; 
    preasigna(); 
   } 
 
   function muestra(){ 
    alert('s1=' + document.getElementById('s1').value + ' s2=' + document.getElementById('s2').value + ' s3=' + document.getElementById('s3').value + ' s4=' + document.getElementById('s4').value); 
   } 
 
  </script> 
 </head> 
 <body> 
  <select id='s1' onchange='recalcula(this, 1)'></select> 
  <select id='s2' onchange='recalcula(this, 2)'></select> 
  <select id='s3' onchange='recalcula(this, 3)'></select> 
  <select id='s4' onchange='recalcula(this, 4)'></select> 
  <input type='button' value='show' onclick='muestra()'> 
  <script language='JavaScript'> 
 
   preasigna(); 
 
  </script> 
 </body> 
</html>

sirchote · #9 (**permalink**) 22/11/2011, 02:21

muchisimas gracias

siento haber tartado en contestar, pero en españa era ya de madrugada

lo pruebo y te digo

sirchote · #10 (**permalink**) 22/11/2011, 09:48

voy a explicar mejor de que va el tema, dado que explicarlo de manera generica es mas complicado
estoy haciendo una pagina para hacer una liguilla de futbol con unos amigos
tenemos una base de datos con los jugadores, y lo que quiero hacer, es poder poner la alineación de un partido

los selects, serian para cada posición. es decir, si juego con 4 defensas, necesito tener 4 selects, desde los cuales poder elegir a los jugadores, y que se muestre el nombre y la habilidad de este jugador, y que una vez un jugador este asignado a una posicion, no se pueda volver a asignar

quiza asi facilito un poco lo que quiero ;)

Kaopectate · #11 (**permalink**) 22/11/2011, 10:17

Eso es lo que creí haber hecho, solo que usando nómeros. Míralo con nombres:

Código PHP:

  <html> 
 <head> 
  <script language='JavaScript'> 
 
   var  
    aNumeros = new Array('Enrique', 'Iván', 'Felipe', 'Camilo', 'Ernesto', 'Julio', 'Javier', 'Hernán'); 
    aValores = new Array('Felipe', 'Julio', 'Javier', 'Iván'); 
 
   function addOption(oCntrl, iPos, sTxt, sVal){ 
    var oOption = new Option(sTxt, sVal); 
    oCntrl.options[iPos] = oOption; 
   } 
 
   function esValido(iControl, nVal){ 
    var bRes = true; 
    for (var i = 0; i < aValores.length; i++) 
     if (i != iControl) 
      bRes = bRes && (aValores[i] != nVal); 
    return bRes; 
   } 
 
   function preasigna(){ 
    for (var i = 1; i <= 4; i++){ 
     oSel = document.getElementById('s' + i); 
     while (oSel.length) 
      oSel.remove(0); 
     for (var j = 0, p = 0; j < aNumeros.length; j++){ 
      if (esValido(i - 1, aNumeros[j])) 
       addOption(oSel, p++, aNumeros[j], aNumeros[j]);  
     } 
     oSel.value = aValores[i - 1]; 
    } 
   } 
 
   function recalcula(oSel, nSel){ 
    aValores[nSel - 1] = oSel.value; 
    preasigna(); 
   } 
 
   function muestra(){ 
    alert('s1=' + document.getElementById('s1').value + ' s2=' + document.getElementById('s2').value + ' s3=' + document.getElementById('s3').value + ' s4=' + document.getElementById('s4').value); 
   } 
 
  </script> 
 </head> 
 <body> 
  <select id='s1' onchange='recalcula(this, 1)'></select> 
  <select id='s2' onchange='recalcula(this, 2)'></select> 
  <select id='s3' onchange='recalcula(this, 3)'></select> 
  <select id='s4' onchange='recalcula(this, 4)'></select> 
  <input type='button' value='show' onclick='muestra()'> 
  <script language='JavaScript'> 
 
   preasigna(); 
 
  </script> 
 </body> 
</html>

sirchote · #12 (**permalink**) 22/11/2011, 10:22

Esta fantástico, es exactamente esto :D

A esto, se le podria programar con un select los datos que quiero mostrar sin que sean fijos?

me he metido de cabeza en hacer una web para hacer esto del futbol, y me pierdo por todos lados :D

Kaopectate · #13 (**permalink**) 22/11/2011, 10:26

Alli ya se sale del dominio del Javascript y entras en los confines del PHP o de ASP...

Nota que el arreglo aValores que yo uso tiene cuatro posiciones y en cada una de ellas tiene el elemento preseleccionado de cada combo. Yo le puse valores iniciales para mostrarte el funcionamiento, pero creo que lo ideal es que al principio esté vacío. Asi:

Código PHP:

  aValores = new Array('Felipe', 'Julio', 'Javier', 'Iván');

Kaopectate · #14 (**permalink**) 22/11/2011, 10:27

Lo siento, asi:

Código PHP:

  aValores = new Array('', '', '', '');

sirchote · #15 (**permalink**) 22/11/2011, 10:27

Muchisimas gracias Kaopectate. Me has resultado de mucha ayuda.
La base ya la tengo ahora, a ver si consigo coger el listado de los jugadores y meterlos en esos selects ;)

sirchote · #16 (**permalink**) 22/11/2011, 10:31

Hmmm, pero, habria posibilidad de mandarle los valores a los valores?

me refiero, yo via php, mandarle a la funcion javascript todos los valores posibles

Kaopectate · #17 (**permalink**) 22/11/2011, 11:11

Claro, solo debes llenar dinámicamente desde PHP el arreglo aNumeros (que paradójicamente contiene los nombres de los jugadores).

sirchote · #18 (**permalink**) 22/11/2011, 13:00

entonces, que debo crear una funcion que espere ciertos datos?

algo asi por ejemplo?

Código PHP:

   function rellenar(jugador,posicion){ 
   aNumeros[posicion]=jugador
   } 




$sql = mysql_query("SELECT * FROM jugadores WHERE id_equipo='$equipo'") or die (mysql_error());
$i=0;
while($rs=mysql_fetch_array($sql)) 
{
rellenar($rs['nombrejugador'],$i);
$i=$i+1;
}

podria del mismo modo, mostrar mas de un campo en el select?

es decir, mostrar $rs['nombrejugador'], $rs['habilidad'], y que cuando desplegaras saliera algo asi como:

Pepito | 70
Juanito | 80
Pablito | 56

sirchote · #19 (**permalink**) 23/11/2011, 08:57

sino, otra posibilidad que veo, es generar una tabla con los jugadores, y luego que me salga un select por cada <td>, y en estos, poner por defecto los valores "Defensa", "Centrocampista", "Delantero".

A pesar, de que preferiría lo de poder mostrar los jugadores dentro del select.

estoy probando lo siguiente:

Código PHP:

  
 
  aNumeros = new Array();  
    aValores = new Array('', '', '', '');   
     
     
    function anadevalor() 
    { 
        aNumeros[<? echo $numero; ?>]=<? echo $pepe; ?>; 
    } 
 
 
</head>  
 <body>  
 
<? 
$pepe='pepe'; 
$numero=0; 
 ?> 
 
<script language='JavaScript'>  
     anadevalor();  
  </script>

Pero no consigo que se añada tampoco :(