Tengo un problema con la validación en el botón de radio.
Intenté tener un ciclo para verificar si el botón de opción está marcado o no, pero resulta que el indicador de entrega sigue siendo cierto
var optDelivery=document.getElementsByName("f__deliver"); var deliveryFlag=false; for (var i=0;i<optDelivery.length;i++){ if (optDelivery.checked){ deliveryFlag=true; } } if (deliveryFlag===true){ alert("AAAA"); optDelivery.style.background="white"; optDelivery.style.color="#000"; } else{ alert("A"); optDelivery.style.background="#DE8971"; optDelivery.style.color="#FFE9D6"; optDelivery.focus(); return false; }Debe acceder a cada radio de entrada por su índice, también la condición debe estar dentro del bucle
También en lugar de return false set deliveryFlag a false
const optDelivery = document.getElementsByName("f__deliver"); for (let i = 0; i < optDelivery.length; i++) { const deliveryFlag = optDelivery[i].checked ? true : false; if (deliveryFlag === true) { console.log("AAAA"); optDelivery[i].style.background = "white"; optDelivery[i].style.color = "#000"; } else { console.log("A"); optDelivery[i].style.background = "#DE8971"; optDelivery[i].style.color = "#FFE9D6"; optDelivery[i].focus(); } } <input type="radio" name="f__deliver" id=""> <input type="radio" name="f__deliver" id=""> <input type="radio" name="f__deliver" id=""> <input type="radio" name="f__deliver" id="" checked> <input type="radio" name="f__deliver" id=""> var optDelivery=document.getElementsByName("f__deliver"); var deliveryFlag=false; for (var i=0;i<optDelivery.length;i++){ if (optDelivery[i].checked){ deliveryFlag=true; } if (deliveryFlag===true){ alert("AAAA"); optDelivery[i].style.backgroundColor="white"; optDelivery[i].style.color="#000"; optDelivery[i].focus(); }else{ alert("A"); optDelivery[i].style.backgroundColor="#DE8971"; optDelivery[i].style.color="#FFE9D6"; } deliveryFlag = false; } <input type='radio' name = 'f__deliver'> <input type='radio' name = 'f__deliver' checked> <input type='radio' name = 'f__deliver'>