opciones de select dependiendo de otro select

PedroRodas · #1 (**permalink**) 17/06/2008, 02:00

Hola, este es mi codigo. Poco voy consiguiendo armar este formulario. Fijaos en el javascript. Hay una funcion llamada cambia. Según este funcion, al cambiar la opcion "material", se cambian las opciones de "modelo". Hasta ahi bien. Pero ahora estoy probando una funcion similar a cambia, la he llamado cambia2.

Necesito que en funcion del modelo elegido, se muestren unas opciones u otras. Esto funciona pero el error esta en que aqui da igual el tipo de material, solo cuenta el modelo elegido. Me explico. Para la funcion es lo mismo que se haya elegido: material:no tejido, opcion 4 que material: algodon,opcion 4.solo tiene en cuenta la opcion de modelo. Podria colocar algun if, o algo asi para preguntar algo como esto:

if (opcionelegidaenmaterial == algodon)
{aqui la funcion con las opciones para cada case:}
else // es decir ==notejido.
{aqui la funcion con las opciones para cada case:}

Es lo que se me ocurre, seguro que alguien tiene una mejor opcion o puede desarrolar la idea que yo he puesto, muchas gracias.

Pongo el codigo en el siguiente post porque no cabe todo en una pregunta.

PedroRodas · #2 (**permalink**) 17/06/2008, 02:04

primera parte del codigo:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
<title>SOLICITUD DE MUESTRA</title> 
<style type="text/css"> 
body{background-color: #CC0000; color:#fff; font:normal 0.7em Verdana, Arial, Helvetica, sans-serif;} 
 
#contenedor{ width:760px; margin:0 auto; position:relative;} 
#contenedor div{ margin-top:0.5em;} 
p.alerta {padding:0 0 0 25px;background:url('img_1/alerta2.png') no-repeat;} 
p.titulo {font:normal 1.2em Verdana, Arial, Helvetica, sans-serif;} 
#contenedor div.absolute input,select,textarea{ position: absolute;left: 270px;} 
label { line-height: 25px;} 
#contenedor #botones{ clear:both;margin-top:12em;margin-bottom:1em} 
 
</style> 
<link href="texto.css" rel="stylesheet" type="text/css"> 
<script language="JavaScript" type="text/JavaScript"> 
   function addOpt(oCntrl, iPos, sTxt, sVal){ 
     var selOpcion=new Option(sTxt, sVal); 
     eval(oCntrl.options[iPos]=selOpcion); 
   } 
 
   function cambia(oCntrl){ 
    while (oCntrl.length) oCntrl.remove(0); 
    switch (document.frm.material.selectedIndex){ 
     case 0:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "38 x 42 dos asas corta", "38 x 42 dos asas corta"); 
      addOpt(oCntrl,  2, "38 x 42 dos asas larga", "38 x 42 dos asas larga"); 
      addOpt(oCntrl,  3, "38 x 42 un asa", "38 x 42 un asa"); 
      addOpt(oCntrl,  4, "38 x 42 dos asas corta y cordón", "38 x 42 dos asas corta y cordón"); 
      addOpt(oCntrl,  5, "38 x 42 dos asas corta y 5 cm. de fondo", "38 x 42 dos asas corta y 5 cm. de fondo"); 
      addOpt(oCntrl,  6, "22 x 27 dos asas cortas", "22 x 27 dos asas cortas");      
      addOpt(oCntrl,  7, "50 x 50 dos asas cortas", "50 x 50 dos asas cortas"); 
      addOpt(oCntrl,  8, "50 x 70 dos asas cortas", "50 x 70 dos asas cortas"); 
      addOpt(oCntrl,  9, "Mochila sin fondo", "Mochila sin fondo");       
      addOpt(oCntrl,  10, "Mochila con fondo circular", "Mochila con fondo circular"); 
      break; 
     case 1:  
      addOpt(oCntrl,  0, "- Selecciona -", "- Selecciona -"); 
      addOpt(oCntrl,  1, "38 x 42 dos asas corta", "38 x 42 dos asas corta"); 
      addOpt(oCntrl,  2, "38 x 42 dos asas larga", "38 x 42 dos asas larga"); 
      addOpt(oCntrl,  3, "38 x 42 un asa", "38 x 42 un asa"); 
      addOpt(oCntrl,  4, "38 x 42 dos asas corta y cordón", "38 x 42 dos asas corta y cordón"); 
      addOpt(oCntrl,  5, "38 x 42 dos asas corta y 5 cm. de fondo", "38 x 42 dos asas corta y 5 cm. de fondo"); 
      addOpt(oCntrl,  6, "22 x 27 dos asas cortas", "22 x 27 dos asas cortas");      
      addOpt(oCntrl,  7, "50 x 50 dos asas cortas", "50 x 50 dos asas cortas"); 
      addOpt(oCntrl,  8, "50 x 70 dos asas cortas", "50 x 70 dos asas cortas"); 
      addOpt(oCntrl,  9, "Mochila sin fondo", "Mochila sin fondo");       
      addOpt(oCntrl,  10, "Mochila con fondo circular", "Mochila con fondo circular"); 
      addOpt(oCntrl,  11, "38x29 2 asas bicolor horizontal y 10cm. de fondo", "38x29 2 asas bicolor horizontal y 10cm. de fondo");     
      addOpt(oCntrl,  12, "38x42 2 asas bicolor vertical y 10cm. de fondo", "38x42 2 asas bicolor vertical y 10cm. de fondo");       
      addOpt(oCntrl,  13, "44x38 2 asas y 10cm. de fondo", "44x38 2 asas y 10cm. de fondo");             
      break; 
    } 
   } 
   function cambia2(oCntrl){ 
    while (oCntrl.length) oCntrl.remove(0); 
    switch (document.frm.modelo.selectedIndex){ 
     case 0:  
      addOpt(oCntrl,  0, "- Selecciona -", "");            
      break; 
     case 1:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion2_1", "2_1"); 
      addOpt(oCntrl,  2, "opcion2_2", "2_2"); 
      addOpt(oCntrl,  3, "opcion2_3", "2_3"); 
      break; 
     case 2:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion3_1", "3_1"); 
      addOpt(oCntrl,  2, "opcion3_2", "3_2"); 
      addOpt(oCntrl,  3, "opcion3_3", "3_3");       
      break; 
     case 3:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion4_1", "4_1"); 
      addOpt(oCntrl,  2, "opcion4_2", "4_2"); 
      addOpt(oCntrl,  3, "opcion4_3", "4_3"); 
      break; 
     case 4:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion5_1", "5_1"); 
      addOpt(oCntrl,  2, "opcion5_2", "5_2"); 
      addOpt(oCntrl,  3, "opcion5_3", "5_3");       
      break; 
     case 5:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion6_1", "6_1"); 
      addOpt(oCntrl,  2, "opcion6_2", "6_2"); 
      addOpt(oCntrl,  3, "opcion6_3", "6_3"); 
      break; 
     case 6:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion7_1", "7_1"); 
      addOpt(oCntrl,  2, "opcion7_2", "7_2"); 
      addOpt(oCntrl,  3, "opcion7_3", "7_3");       
      break; 
     case 7:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion8_1", "8_1"); 
      addOpt(oCntrl,  2, "opcion8_2", "8_2"); 
      addOpt(oCntrl,  3, "opcion8_3", "8_3");       
      break; 
     case 8:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion7_1", "7_1"); 
      addOpt(oCntrl,  2, "opcion7_2", "7_2"); 
      addOpt(oCntrl,  3, "opcion7_3", "7_3");       
      break; 
     case 9:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion8_1", "8_1"); 
      addOpt(oCntrl,  2, "opcion8_2", "8_2"); 
      addOpt(oCntrl,  3, "opcion8_3", "8_3");       
      break;       
     case 10:  
      addOpt(oCntrl,  0, "- Selecciona -", "");      
      addOpt(oCntrl,  1, "opcion9_1", "10_1"); 
      addOpt(oCntrl,  2, "opcion9_2", "10_2"); 
      addOpt(oCntrl,  3, "opcion9_3", "10_3");       
      break; 
    } 
   }

PedroRodas · #3 (**permalink**) 17/06/2008, 02:08

sengunda parte del codigo

Código PHP:

 
</script> 
</head> 
<body> 
<?php 
 $contactocorrecto=true; 
 $emailcorrecto=true; 
 $telefonocorrecto=true; 
 $modelocorrecto=true; 
 if (isset($_POST['datos_enviados'])) { 
  
 if($_POST['contacto']==""){$contactocorrecto=false;} 
 if($_POST['email']==""){$emailcorrecto=false;} 
 if($_POST['telefono']==""){$telefonocorrecto=false;} 
 if($_POST['modelo']=="- Selecciona -"){$modelocorrecto=false;} 
 //if($_POST['color']==""){$colorcorrecto=false;} 
 
  
 if ($contactocorrecto && $emailcorrecto && $telefonocorrecto && $modelocorrecto) 
 { 
 require("includes/class.phpmailer.php"); 
 $mail = new PHPMailer(); 
  
 $mail->PluginDir = "includes/";  
  
 $mail->Mailer = "smtp"; 
  
 $mail->Host = "smtp.labolsaolavida.com"; 
  
 $mail->SMTPAuth = true; 
 $mail->Username = "labolsao01";  
 $mail->Password = "fifina"; 
  
 $tmp_name = $_FILES['archivo']['tmp_name']; 
 $name = $_FILES['archivo']['name']; 
 $empresa = $_POST['empresa']; 
 $contacto = $_POST['contacto']; 
 $email = $_POST['email']; 
 $direccion = $_POST['direccion']; 
 $ciudad = $_POST['ciudad']; 
 $telefono = $_POST['telefono']; 
 $fax = $_POST['fax']; 
 $material = $_POST['material']; 
 $modelo = $_POST['modelo']; 
 //$color = $_POST['color']; 
 $archivo = $_FILES['archivo']['name']; 
 $comentario = $_POST['comentario']; 
  
  
 $mail->Body = "<h3>Datos de la empresa</h3><hr></br> 
 <b>Empresa:</b> ".$empresa."<br/><b>Persona de contacto:</b> ".$contacto."<br/> 
 <b>E-mail:</b> ".$email."<br/><b>Direcci&oacute;n:</b> ".$direccion."<br/> 
 <b>Ciudad:</b> ".$ciudad."<br/> <b>Tel&eacute;fono:</b> ".$telefono."<br/> 
 <b>Fax:</b> ".$fax."<br/><h3>Datos para la muestra</h3><hr> <b>Material:</b> ".$material."<br/> 
 <b>Modelo:</b> ".$modelo."<br/> <b>Color:</b> A&uacute;n no<br/> 
 <b>Logotipo / Archivo:</b> ".$archivo."<br/><h3>Comentarios</h3><hr> <b>Comentario:</b> ".$comentario."<br/>"; 
 
 $body = $mail->Body; 
  
 $mail->AltBody = "esto es un mensaje de prueba para el AltBody"; 
  
 $mail->AddAttachment($tmp_name, $name); 
       
 //$mail->MsgHTML($body); 
  
 $mail->From = "[email protected]"; 
 $mail->FromName = "Pedro"; 
 $mail->Subject = "Contacto desde el sitio web"; 
  
 $mail->AddAddress("[email protected]"); 
 
 $mail->Timeout=120; 
  
$exito = $mail->Send(); 
  
 if(!$exito) { 
 echo "<p class='aviso'>El mensaje no ha podido ser enviado, por favor inténtalo de nuevo.</p>"; 
 }  
 else { 
 echo "<p class='aviso>¡Mensaje enviado correctamente!</p>"; 
 } 
 }//fin del if de datos correctos 
 else//del if de datos correctos, es decir, si no hay datos correctos 
    {// else del if datos correctos inicio 
 ?> 
 <div id=contenedor> 
    <p class="titulo">Solicita <strong>GRATUITAMENTE</strong> tu muestra digital, dise&ntilde;aremos tu bolsa con las caracter&iacute;sticas que nos indiques.</p> 
    <form action="formulario_1columna.php" method="post" enctype="multipart/form-data" name="frm"> 
        <div class="absolute"><label for="empresa">Empresa:</label><input name="empresa" type="text" id="empresa" size="25" value="<?=$_POST['empresa']?>"></div> 
        <div class="absolute"><label for="contacto">(*) Persona de contacto:</label><input name="contacto" type="text" id="contacto" size="25" value="<?=$_POST['contacto']?>"></div> 
        <? if(!$contactocorrecto){ 
        echo "<p class=\"alerta\">Debes introducir una persona de contacto</p>"; 
        } 
        ?> 
        <div class="absolute"><label for="email">(*) E-mail:</label><input name="email" type="text" id="email" size="25" value="<?=$_POST['email']?>"></div> 
        <? if(!$emailcorrecto){ 
        echo "<p class=\"alerta\">Debes introducir un E-mail</p>"; 
        } 
        ?>         
        <div class="absolute"><label for="direccion">Direccion:</label><input name="direccion" type="text" id="direccion" size="25" value="<?=$_POST['direccion']?>"></div> 
        <div class="absolute"><label for="ciudad">C. Postal - Ciudad:</label><input name="ciudad" type="text" id="ciudad" size="25" value="<?=$_POST['ciudad']?>"></div> 
        <div class="absolute"><label for="telefono">(*) Tel&eacute;fono:</label><input name="telefono" type="text" id="telefono" size="25" value="<?=$_POST['telefono']?>"></div> 
        <? if(!$telefonocorrecto){ 
        echo "<p class=\"alerta\">Debes introducir un teléfono</p>"; 
        } 
        ?>         
        <div class="absolute"><label for="fax">Fax:</label><input name="fax" type="text" id="fax" size="25" value="<?=$_POST['fax']?>"></div> 
        <div class="absolute"> <label for="material">(*) Tipo de material:</label><select name="material" onchange="cambia(document.frm.modelo)" value="<?=$_POST['material']?>"> 
            <option value="Algodón">Algod&oacute;n</option> 
            <option value="No-tejido">No tejido</option> 
                                        </select></div> 
        <div class="absolute"> <label for="modelo">(*) Modelo de bolsa:</label><select name="modelo" value="<?=$_POST['modelo']?>">       
            <option>38 x 42 dos asas corta </option> 
            <option>38 x 42 dos asas larga </option> 
            <option>38 x 42 un asa </option> 
            <option>38 x 42 dos asas corta y cord&oacute;n </option> 
            <option>38 x 42 dos asas corta y 5 cm. de fondo </option> 
            <option>22 x 27 dos asas cortas </option> 
            <option>50 x 50 dos asas cortas </option> 
            <option>50 x 70 dos asas cortas </option> 
            <option>mochila sin fondo </option> 
            <option>mochila con fondo circular </option> 
           <option selected>- Selecciona -</option> 
                                        </select></div> 
        <? if(!$modelocorrecto){ 
        echo "<p class=\"alerta\">Debes seleccionar uno de nuestros modelos</p>"; 
        } 
        ?>                                             
        <div class="absolute"> <label for="color">(*) Color de bolsa:</label></div>  
        <div class="absolute"> <label for="archivo">Env&iacute;anos tu logotipo:</label><input name="archivo" type="file" class="form" value="<?=$_FILES['archivo']['name']?>"></div>  
        <div class="absolute"> <label for="comentario">Comentarios:</label><textarea name="comentario" cols="40" rows="7" class="form" id="comentario" value="<?=$_POST['comentario']?>"></textarea></div>                  
        <div id="botones"><input name="reset" type="reset" value="borrar"> 
                          <input name="datos_enviados" type="submit" value="Enviar"></div> 
        <div><span>(*): Campos obligatorios.</span></div> 
    </form> 
</div> 
<? 
 }//fin del else de los datos correctos, es decir fin de las acciones que tienen lugar cuando los datos no son correctos. 
 }//fin del if datos enviados, es decir, si no se han enviado los datos.mostramos el formulario para que puedan ser enviados. 
 else 
 { 
?> 
<div id=contenedor> 
    <p>Solicita <strong>GRATUITAMENTE</strong> tu muestra digital, dise&ntilde;aremos tu bolsa con las caracter&iacute;sticas que nos indiques.</p> 
    <form action="formulario_1columna.php" method="post" enctype="multipart/form-data" name="frm"> 
        <div class="absolute"><label for="empresa">Empresa:</label><input name="empresa" type="text" id="empresa" size="25"></div> 
        <div class="absolute"><label for="contacto">(*) Persona de contacto:</label><input name="contacto" type="text" id="contacto" size="25"></div> 
        <div class="absolute"><label for="email">(*) E-mail:</label><input name="email" type="text" id="email" size="25"></div> 
        <div class="absolute"><label for="direccion">Direccion:</label><input name="direccion" type="text" id="direccion" size="25"></div> 
        <div class="absolute"><label for="ciudad">C. Postal - Ciudad:</label><input name="ciudad" type="text" id="ciudad" size="25"></div> 
        <div class="absolute"><label for="telefono">(*) Tel&eacute;fono:</label><input name="telefono" type="text" id="telefono" size="25"></div> 
        <div class="absolute"><label for="fax">Fax:</label><input name="fax" type="text" id="fax" size="25"></div> 
        <div class="absolute"> <label for="material">(*) Tipo de material:</label><select name="material" onchange="cambia(document.frm.modelo)"> 
            <option value="Algodón">Algod&oacute;n</option> 
            <option value="No-tejido">No tejido</option> 
                                        </select></div>  
        <div class="absolute"> <label for="modelo">(*) Modelo de bolsa:</label><select name="modelo" onchange="cambia2(document.frm.color)">       
            <option>38 x 42 dos asas corta </option> 
            <option>38 x 42 dos asas larga </option> 
            <option>38 x 42 un asa </option> 
            <option>38 x 42 dos asas corta y cord&oacute;n </option> 
            <option>38 x 42 dos asas corta y 5 cm. de fondo </option> 
            <option>22 x 27 dos asas cortas </option> 
            <option>50 x 50 dos asas cortas </option> 
            <option>50 x 70 dos asas cortas </option> 
            <option>mochila sin fondo </option> 
            <option>mochila con fondo circular </option> 
           <option selected>- Selecciona -</option> 
                                        </select></div>  
        <div class="absolute"> <label for="color">(*) Color de bolsa:</label> <select name="color">       
            <option>Rojo </option> 
            <option>Verde </option> 
            <option>Azul </option> 
            <option selected>- Selecciona -</option> 
                                        </select></div>    <br/><br/><br/><br/><br/><br/>     
        <div class="absolute"> <label for="archivo">Env&iacute;anos tu logotipo:</label><input name="archivo" type="file" class="form"></div>  
        <div class="absolute"> <label for="comentario">Comentarios:</label><textarea name="comentario" cols="40" rows="7" class="form" id="comentario"></textarea></div>          
        <div id="botones"><input name="borrar" type="button" value="borrar" onclick="location.href='../www/fomulario_columna1.php'"> 
                          <input name="datos_enviados" type="submit" value="Enviar"></div> 
        <div><span>(*): Campos obligatorios.</span></div> 
    </form> 
</div> 
<? 
} 
?> 
</body> 
</html>

PedroRodas · #4 (**permalink**) 18/06/2008, 01:19

Hola de nuevo, no se si mi pregunta es incorrecta o vulnera algun tipo de normas de la web, o es que simplemente no encontrais ninguna solucion (no creo q esto sea posible). Si estoy preguntando de una forma que no debo o algo asi, por favor decirmelo.

muchas gracias.