Foros del Web » Programando para Internet » Javascript »

al seleccionar un option de un select, que otro select cambie

 Estas en el tema de al seleccionar un option de un select, que otro select cambie en el foro de Javascript en Foros del Web. Que tal, espero me puedan ayudar. Estoy haciendo un formulario donde el usuario elige un Banner, Link o Cartel: Código PHP: < select name = "categoria" ...
  #1 (permalink)  
Antiguo 29/03/2010, 23:48
Avatar de locmasm  
Fecha de Ingreso: noviembre-2007
Ubicación: México D. F.
Mensajes: 301
Antigüedad: 16 años, 5 meses
Puntos: 1
Pregunta al seleccionar un option de un select, que otro select cambie
Que tal, espero me puedan ayudar.

Estoy haciendo un formulario donde el usuario elige un Banner, Link o Cartel:

Código PHP:
<select name="categoria">
<option value="0" selected>Banner</option>
<option value="2">Link</option>
<option value="3">Cartel</option>
</select> 
Y otro formulario donde eligen el tamaño, si es banner, eligen si es texto o si es cartel:

Código PHP:
<select name="tamano">
<option value="0" selected>Sin banner, sólo link</option>
<option value="1">732x92 (Banner superior)</option>
<option value="2">120x600 (Banners laterales)</option>
<option value="3">468x60 (Banner inferior)</option>
<option value="4">Cartel</option>
</select> 
Lo que necesito es que si en el primer select seleccionan "Link" automáticamente en el segundo se seleccione "Sin banner, sólo link" y que no puedan seleccionar otro, de igual forma con el cartel.

Y si en el primer select eligen "Banner", que en el segundo sólo puedan seleccionar las opciones que tienen medidas (732x92,120x600,468x60) las otras 2 no.

Espero me puedan ayudar, de antemano gracias a todos.
  #2 (permalink)  
Antiguo 30/03/2010, 09:09
 
Fecha de Ingreso: enero-2010
Mensajes: 29
Antigüedad: 14 años, 3 meses
Puntos: 0
Respuesta: al seleccionar un option de un select, que otro select cambie
HOla asi en plan rapido:

<script type="text/javascript">
function selectTamano (obj){

if (obj.value == 2){
document.frm. tamano.options[indice].disable = true,
}
else{
.....
}

}
</script>

<select name="categoria">
<option value="0" selected>Banner</option>
<option value="2">Link</option>
<option value="3">Cartel</option>
</select>

Espero que te sirva, no lo he probado por que ahora tengo prisa.

Cuentame y le pongo un poco de tiempo, ahora me tengo que ir a cojer un avion.
  #3 (permalink)  
Antiguo 30/03/2010, 09:40
 
Fecha de Ingreso: marzo-2010
Mensajes: 432
Antigüedad: 14 años, 1 mes
Puntos: 11
Respuesta: al seleccionar un option de un select, que otro select cambie
acá tengo un code, no es mio pertenece al faq de este foro.

Código Javascript: 
Ver original
  1. <!-- basado en el código original propuesto por Kaopectate --> 
  2. <html> 
  3.  <head> 
  4.   <script language="JavaScript"> 
  5.  
  6.    function addOpt(oCntrl, iPos, sTxt, sVal){ 
  7.      var selOpcion=new Option(sTxt, sVal); 
  8.      eval(oCntrl.options[iPos]=selOpcion); 
  9.    } 
  10.  
  11.    function cambia(oCntrl){ 
  12.     switch (document.frm.pais.selectedIndex){ 
  13.      case 0:  
  14.       addOpt(oCntrl,  0, "Ciudad de México", "http://www.mexico.com"); 
  15.       addOpt(oCntrl,  1, "Monterrey", "http://www.monterrey.com"); 
  16.       addOpt(oCntrl,  2, "Guadalajara", "http://www.guadalajara.com"); 
  17.       break; 
  18.      case 1:  
  19.       addOpt(oCntrl,  0, "Madrid", "http://www.madrid.com"); 
  20.       addOpt(oCntrl,  1, "Barcelona", "http://www.barcelona.com"); 
  21.       addOpt(oCntrl,  2, "San Sebastián", "http://www.sansebastian.com"); 
  22.       break; 
  23.      case 2:  
  24.       addOpt(oCntrl,  0, "Caracas", "http://www.caracas.com"); 
  25.       addOpt(oCntrl,  1, "Maracay", "http://www.maracay.com"); 
  26.       addOpt(oCntrl,  2, "Valencia", "http://www.valencia.com"); 
  27.       break; 
  28.     } 
  29.    } 
  30.   </script> 
  31.  </head> 
  32.  <body> 
  33.   <form name="frm"> 
  34.    <table border="0" width="482"> 
  35.     <tr> 
  36.      <td width="25"> 
  37.       Pais 
  38.      </td> 
  39.      <td width="89"> 
  40.       <select name="pais" onchange="cambia(document.frm.ciudad)"> 
  41.        <option value="Mex">Mexico</option> 
  42.        <option value="Esp">España</option> 
  43.        <option value="Ven">Venezuela</option> 
  44.       </select> 
  45.      </td> 
  46.      <td width="6"> 
  47.       &nbsp; 
  48.      </td> 
  49.      <td width="44"> 
  50.       Ciudad 
  51.      </td> 
  52.      <td width="296"> 
  53.       <select name="ciudad" onChange="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"> 
  54.        <option value="0">Ciudad de México</option> 
  55.        <option value="1">Monterrey</option> 
  56.        <option value="2">Guadalajara</option> 
  57.       </select> <input type="button" value="Ir a..." onClick="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"</td> 
  58.     </tr> 
  59.    </table> 
  60.   </form> 
  61.  </body> 
  62. </html>
  #4 (permalink)  
Antiguo 30/03/2010, 16:41
Avatar de locmasm  
Fecha de Ingreso: noviembre-2007
Ubicación: México D. F.
Mensajes: 301
Antigüedad: 16 años, 5 meses
Puntos: 1
Respuesta: al seleccionar un option de un select, que otro select cambie
Cita:
Iniciado por tazzwt Ver Mensaje
acá tengo un code, no es mio pertenece al faq de este foro.

Código Javascript: 
Ver original
  1. <!-- basado en el código original propuesto por Kaopectate --> 
  2. <html> 
  3.  <head> 
  4.   <script language="JavaScript"> 
  5.  
  6.    function addOpt(oCntrl, iPos, sTxt, sVal){ 
  7.      var selOpcion=new Option(sTxt, sVal); 
  8.      eval(oCntrl.options[iPos]=selOpcion); 
  9.    } 
  10.  
  11.    function cambia(oCntrl){ 
  12.     switch (document.frm.pais.selectedIndex){ 
  13.      case 0:  
  14.       addOpt(oCntrl,  0, "Ciudad de México", "http://www.mexico.com"); 
  15.       addOpt(oCntrl,  1, "Monterrey", "http://www.monterrey.com"); 
  16.       addOpt(oCntrl,  2, "Guadalajara", "http://www.guadalajara.com"); 
  17.       break; 
  18.      case 1:  
  19.       addOpt(oCntrl,  0, "Madrid", "http://www.madrid.com"); 
  20.       addOpt(oCntrl,  1, "Barcelona", "http://www.barcelona.com"); 
  21.       addOpt(oCntrl,  2, "San Sebastián", "http://www.sansebastian.com"); 
  22.       break; 
  23.      case 2:  
  24.       addOpt(oCntrl,  0, "Caracas", "http://www.caracas.com"); 
  25.       addOpt(oCntrl,  1, "Maracay", "http://www.maracay.com"); 
  26.       addOpt(oCntrl,  2, "Valencia", "http://www.valencia.com"); 
  27.       break; 
  28.     } 
  29.    } 
  30.   </script> 
  31.  </head> 
  32.  <body> 
  33.   <form name="frm"> 
  34.    <table border="0" width="482"> 
  35.     <tr> 
  36.      <td width="25"> 
  37.       Pais 
  38.      </td> 
  39.      <td width="89"> 
  40.       <select name="pais" onchange="cambia(document.frm.ciudad)"> 
  41.        <option value="Mex">Mexico</option> 
  42.        <option value="Esp">España</option> 
  43.        <option value="Ven">Venezuela</option> 
  44.       </select> 
  45.      </td> 
  46.      <td width="6"> 
  47.       &nbsp; 
  48.      </td> 
  49.      <td width="44"> 
  50.       Ciudad 
  51.      </td> 
  52.      <td width="296"> 
  53.       <select name="ciudad" onChange="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"> 
  54.        <option value="0">Ciudad de México</option> 
  55.        <option value="1">Monterrey</option> 
  56.        <option value="2">Guadalajara</option> 
  57.       </select> <input type="button" value="Ir a..." onClick="location.href=this.form.ciudad.options[this.form.ciudad.selectedIndex].value"</td> 
  58.     </tr> 
  59.    </table> 
  60.   </form> 
  61.  </body> 
  62. </html>
Funcionó a la perfección, en unos minutos les publicaré como me quedó el código.
  #5 (permalink)  
Antiguo 30/03/2010, 19:53
Avatar de locmasm  
Fecha de Ingreso: noviembre-2007
Ubicación: México D. F.
Mensajes: 301
Antigüedad: 16 años, 5 meses
Puntos: 1
De acuerdo Respuesta: al seleccionar un option de un select, que otro select cambie
Bueno, resulta que el código anterior no me funcionó, pero este si:

Código PHP:
<script language="JavaScript"> 
function cambiar()
{
   var index=document.forms.formulario.categoria.selectedIndex;
   
   formulario.tamano.length=0;
   
   if(index==0) fun1();
   if(index==1) fun2();
   if(index==2) fun3();
}
 
function fun1(){
  opcion0=new Option("732x92 (Banner superior)","1","defauldSelected");
  opcion1=new Option("120x600 (Banner's laterales)","2");
  opcion2=new Option("468x60 (Banner inferior)","3");
  
  document.forms.formulario.tamano.options[0]=opcion0;
  document.forms.formulario.tamano.options[1]=opcion1;
  document.forms.formulario.tamano.options[2]=opcion2;  
 }
 
function fun2(){
  opcion0=new Option("Sin banner, sólo link","0","defauldSelected");
  
  document.forms.formulario.tamano.options[0]=opcion0;
 }
 
function fun3(){
  opcion0=new Option("Cartel","4","defauldSelected");
 
  document.forms.formulario.tamano.options[0]=opcion0;
 } 
</script> 
<form action="" method="post" name="formulario">

<select name="categoria" onchange="cambiar()" class="eforo_formulario"> 
<option value="0" selected>Banner</option>
<option value="2">Link</option>
<option value="3">Cartel</option>
</select> 
    
<select name="tamano" class="eforo_formulario">
<option value="1">732x92 (Banner superior)</option>
<option value="2">120x600 (Banner's laterales)</option>
<option value="3">468x60 (Banner inferior)</option>
</select>

</form> 
Lo tome y modifique según mis necesidades

Fuente: http://www.elguruprogramador.com.ar/...pendientes.htm

Etiquetas: option, seleccionar, select, cambios
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 12:16.