0

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>

1
  • Saludos. Revisa las etiquetas; nada del código que pusiste es PHP; además no incluyes en que momento inicializas document.rack.racks y demás que usas de document; bueno al menos yo no lo noto. Commented el 2 may. 2023 a las 20:02

1 respuesta 1

0

Si vamos a lo que es la sintaxis, probablemente cambiaría el 90% de tu código, sin embargo, esta solución sería acorde a tu código actual:

function select_rack() {
    // eliminé el var racks vacío
    var racks = document.rack.racks[document.rack.racks.selectedIndex].value;

    /* el switch evalúa lo que se le pasa entre los paréntesis. En este caso,
    hará la acción correspondiente al valor que tenga racks */
    switch (racks) {
        case 'A':
            sel_racks = todosNiveles[1];
            break;
        case 'B':
            sel_racks = todosNiveles[2];
            break;
        case 'C':
            sel_racks = todosNiveles[3];
            break;
        case 'D':
            sel_racks = todosNiveles[4];
            break;
        default:
            /* en caso de racks no tenga valor (como el Seleccione...),
            sólo genera el guión */
            document.rack.niveles.length = 1
            document.rack.niveles.options[0].value = "-"
            document.rack.niveles.options[0].text = "-"
        
            /* el return corta el flujo de la función en este punto
            y todo lo que está debajo queda sin ejecutarse */
            return;
    }

    console.log(sel_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]
    }

    document.rack.niveles.options[0].selected = true
}

Lo único que hace el código es remover tu if y reemplazarlo por un switch

Además, le estabas pasando al array como índice las letras de los values (A, B, C, D) y esto sólo generaba un undefined.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.