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: 15 años, 2 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 bannersó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: 13 años
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: 12 años, 10 meses
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: 15 años, 2 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: 15 años, 2 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==0fun1();
   if(
index==1fun2();
   if(
index==2fun3();
}
 
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




La zona horaria es GMT -6. Ahora son las 00:14.