Ver Mensaje Individual
  #1 (permalink)  
Antiguo 28/01/2011, 14:48
roser24
 
Fecha de Ingreso: marzo-2010
Mensajes: 127
Antigüedad: 14 años, 8 meses
Puntos: 2
Problema con selects

Hola chic@s,
Tengo el siguiente problema son 2 selects que no se que me falta o mejor dicho porque no se actualiza correctamente la 2º select.
son tres opciones para la primera select Animal,Vegetal y Mineral y en la segunda select deberian de mostrarse distintos animales,pero no se encuentran bien asociados aparentemente,porfavor si veis el error os agradeceria mucho vuestra ayuda..le he dado mil vueltas y no doy con ello..

Código Javascript:
Ver original
  1. <html>
  2. <head>
  3. <script>
  4. var Animal=new Array('Condor','Gorila','Koala','Lince','Oso Panda','Puma','Tatu','Tigre');
  5. var Vegetal=new Array('Alamo','Almendro','Baobab','Drago','Encina','Haya','Sauce','Sequoia');
  6. var Mineral=new Array('Agata','Aguamarina','Cinabrio','Cuarzo','Esmeralda','Mercurio','Pirita','Rubi');
  7. </script>
  8. </head>
  9. <body>
  10. <form name='f1'>
  11. <select name="sel_reino" onchange="pon_asociada()">
  12. <option>-Seleccione reino-</option>
  13.  
  14. <option>Animal</option>
  15. <option>Vegetal</option>
  16. <option>Mineral</option>
  17. </select>
  18.  
  19. <select name="sel_asociados">
  20. <script>
  21. for(var i=0;i<Animal.length;i++){
  22.  
  23.  
  24. document.write("<option>"+Animal[i]+"</option>");
  25. }
  26. </script>
  27. </select>
  28. <script>
  29. function pon_asociada(){
  30. var indice=document.f1.sel_reino.selectedIndex;
  31. var lista;
  32. switch(indice){
  33. case 0:lista=Animal;break;
  34. case 1:lista=Vegetal;break;
  35. case 2:lista=Mineral;break;
  36. default: alert('Error en el indice: ' + indice);
  37. }
  38. document.f1.sel_asociados.length=lista.length;//igualamos tamaños
  39. for(var i=0;i<lista.length;i++){
  40. var opcion=new Option(lista[i],lista[i],false,false)
  41. document.f1.sel_asociados.options[i]=opcion;
  42. }
  43. }
  44. </script>
  45. </form>
  46. </body>
  47. </html>