JavaScript - Problema con querySelectorAll

 
Vista:
sin imagen de perfil
Val: 24
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Problema con querySelectorAll

Publicado por John (6 intervenciones) el 09/02/2021 22:22:05
Buenas noches, tengo un problemilla con el siguiente código:

En el index tengo un select con varias opciones, quiero acceder al data-base para crear una restricción pero no consigo que funcione.

index:

1
2
3
4
5
<select id="lstIngredientes" name="lstIngredientes" class="form-control" multiple="multiple">
    <option value="Gambas" data-precio="2" data-base="S" class="base">Gambas</option>
    <option value="Cerdo" data-precio="1.75" data-base="S" class="base">Cerdo</option>
    <option value="Almendras" data-precio="0.50" data-base="N">Almendras</option>
    <option value="Nuez" data-precio="0.60" data-base="N">Nuez</option>

js:
1
2
3
4
5
if(!document.querySelectorAll('option[data-base="S"]').lenght ==1)
    mensaje("Solo puedes escoger un ingrediente base.");
 
if(!document.querySelectorAll("option[data-base='N']").lenght > 0)
    mensaje("Tienes que elegir al menos 1 ingrediente opcional.");

Al darle a enviar, me da los dos mensajes aunque no se cumplan esas condiciones.
A ver si me podéis ayudar porque no encuentro el fallo. Gracias.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 24
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Problema con querySelectorAll

Publicado por John (6 intervenciones) el 10/02/2021 00:26:11
Me auto contesto:

El problema era que no controlaba si estaba chequeado o no y en el query no hay que poner option, así que quedaría tal que así:

1
2
3
4
5
6
7
8
9
10
11
12
13
let ingreBase = document.querySelectorAll('[data-base="S"]:checked').length;
if(ingreBase !==1)
{
    alert("Solo puedes elegir 1 solo ingrediente base.");
    return;
}
 
let ingreOpc = document.querySelectorAll('[data-base="N"]:checked').length;
if (ingreOpc < 1)
{
    alert("Debes elegir al menos 1 ingrediente opcional.");
    return;
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar