¿Habéis usado alguna vez un DynamicOptionList? (más información en http://www.javascripttoolbox.com/lib/dy ... /index.php)
Pues yo estoy en ello pero tengo una duda que no consigo resolver, y llevo ya tiempo con esto. A ver yo tengo 3 select, y 2 de ellos dependen del valor del primero, de manera que cuando el usuario elija una opción en el primer select en los otros 2 que son dependientes de éste se actualicen con las opciones que se pueden elegir con esa opción que elijió el usuario en el primer select, ¿entendeis?.
Os ilustro con ejemplos:
Por ejemplo: dependiendo del sexo se podrá elegir un nombre u otro y un apellido u otro (el nombre y los apellidos dependen del sexo):
- <html>
- <head>
- <title>Documento sin título</title>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
- </head>
- <script type="text/javascript" src="dynamicoptionlist.js"></script>
- <script type="text/javascript">
- var namesSex = new DynamicOptionList();
- namesSex.addDependentFields("sex","names");
- namesSex.forValue("boy").addOptions("Matt","Bob","Joe","Bill","John");
- namesSex.forValue("girl").addOptions("Jane","Angie","Jennifer","Amy","Sue");
- namesSex.selectFirstOption = false;
- </script>
- <body onLoad="initDynamicOptionLists()">
- <form name="form1" action="" method="get">
- Sexo: <select name="sex">
- <option selected="selected" value="boy">boy</option>
- <option value="girl">girl</option>
- </select>
- Nombres: <select name="names">
- <script type="text/javascript">namesSex.printOptions("names")</script>
- </select>
- <script type="text/javascript">
- var apellidoSex = new DynamicOptionList();
- apellidoSex.addDependentFields("sex1","apellidos");
- apellidoSex.forValue("boy").addOptions("apellido1","apellido2");
- apellidoSex.forValue("girl").addOptions("apellido3","Apellido4");
- apellidoSex.selectFirstOption = false;
- </script>
- Sexo 2º: <select name="sex1">
- <option selected="selected" value="boy">boy</option>
- <option value="girl">girl</option>
- </select>
- Apellidos: <select name="apellidos">
- <script type="text/javascript">apellidoSex.printOptions("apellidos")</script>
- </select>
- </form>
- </body>
- </html>
De esta manera me funciona, pero no es lo que quiero, porque aquí en sexo aparecería 2 veces (sex y sex1), pero yo quiero que aparezca sólo 1 vez:
- <html>
- <head>
- <title>Documento sin título</title>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
- </head>
- <script type="text/javascript" src="dynamicoptionlist.js"></script>
- <script type="text/javascript">
- var namesSex = new DynamicOptionList();
- namesSex.addDependentFields("sex","names");
- namesSex.forValue("boy").addOptions("Matt","Bob","Joe","Bill","John");
- namesSex.forValue("girl").addOptions("Jane","Angie","Jennifer","Amy","Sue");
- namesSex.selectFirstOption = false;
- </script>
- <body onLoad="initDynamicOptionLists()">
- <form name="form1" action="" method="get">
- Sexo: <select name="sex">
- <option selected="selected" value="boy">boy</option>
- <option value="girl">girl</option>
- </select>
- Nombres: <select name="names">
- <script type="text/javascript">namesSex.printOptions("names")</script>
- </select>
- <script type="text/javascript">
- var apellidoSex = new DynamicOptionList();
- apellidoSex.addDependentFields("sex","apellidos");
- apellidoSex.forValue("boy").addOptions("apellido1","apellido2");
- apellidoSex.forValue("girl").addOptions("apellido3","Apellido4");
- apellidoSex.selectFirstOption = false;
- </script>
- Apellidos: <select name="apellidos">
- <script type="text/javascript">apellidoSex.printOptions("apellidos")</script>
- </select>
- </form>
- </body>
- </html>
Y quiero hacerlo usando los DynamicOptionList, pero es que no hay manera, llevo ya 1 semana estancado aquí y no hay manera....si me pudierais ayudar os lo agradecería.
Muchas gracias.