Skip to main content
etiquetas editadas
Enlace
Origen Enlace

Select con letras del abecedario y mostrar datos en otro select

Estoy intentando crear un select que permita elegir una opción con determinada letra y a su vez al dar clic muestre datos en otro select.

La situación es que no me cargan las letras en el "for", estuve usando las opciones más viables para solucionarlo pero no lo logré.

¿Alguien sabe cómo solucionar ese detalle?

Adjunto código.

  var nivel_1=new Array("-","1","2","3","4","5","6");
  var nivel_2=new Array("-","1","2","3","4");
  var nivel_3=new Array("-","1","2","3","4","5","6");
  var nivel_4=new Array("-","1","2","3","4");

  var todosNiveles = [
    [],
    nivel_1,
    nivel_2,
    nivel_3,
    nivel_4,
  ];

  function select_rack(){ 
    var racks 
    racks = document.rack.racks[document.rack.racks.selectedIndex].value 
    if (racks != 0) { 
        sel_racks=todosNiveles[racks]
        num_racks = sel_racks.length 
        document.rack.niveles.length = num_racks 
        for(i=0;i<num_racks;i++){ 
            document.rack.niveles.options[i].value=sel_racks[i] 
            document.rack.niveles.options[i].text=sel_racks[i] 
        }   
    }else{ 
        document.rack.niveles.length = 1 
        document.rack.niveles.options[0].value = "-" 
        document.rack.niveles.options[0].text = "-" 
    } 
    document.rack.niveles.options[0].selected = true 
}
<form name="rack"> 
    <select name=racks onchange="select_rack()"> 
    <option value="" selected>Seleccione... 
    <option value="A">Rack A
    <option value="B">Rack B 
    <option value="C">Rack C 
    <option value="D">Rack D 
    </select>
    
    <select name=niveles> 
    <option value="-">- 
    </select> 
  </form>