He estado trabajando en un formulario simple que tendrá varios (2-3) conjuntos de preguntas que contienen botones de opción como respuestas. Cada botón de opción tiene un valor numérico. Pude trabajar en una lógica que muestra u oculta un cuadro de texto cuando el usuario selecciona un determinado botón de opción. En el código original que encontré, la validación verifica solo una pregunta específica, pero quiero actualizar el código de validación de manera que si CUALQUIERA de las preguntas tiene un cuadro de texto visible y está vacío, debería aparecer la alerta. arriba.
Aquí hay una página JSFiddle con el código: https://jsfiddle.net/nxenxoo/92myvwc3/25/
En este momento, si en la pregunta n.º 1 hago clic en los botones de radio 1-3 y me olvido de completar el cuadro de texto, paso a la segunda pregunta y presiono el botón de radio 10, por ejemplo, la validación funciona muy bien. Aparece una ventana emergente.
Sin embargo, digamos que completo el cuadro de texto requerido para la pregunta n.° 1 y dejo el cuadro de texto que aparece para la pregunta n.° 2, luego obtengo un error 404 al enviar.
Estaba tratando de trabajar en una declaración OR || a continuación, esperaba que funcionara, pero desafortunadamente no es así.
function validateForm(){ var x= $("form input[type=text]").val(); if ($('.showother' || '.showother2').is(":visible")) { if ( x==null || x=="") { alert("Please fill in all text boxes"); return false;Tengo curiosidad por saber cual puede ser el problema. Sé muy poco de javascript, ¡así que lo siento si esta es una pregunta muy básica!
HTML
<div id="Other" class="showother" style="display:none">Please specify <input name="textbox" id="textbox" type="text"> </div> ... <div id="Other2" class="showother2" style="display:none">Please specify <input name="textbox" id="textbox2" type="text"> </div>JavaScript
var x= $("form input[type=text]").val(); ... "form input[type=text]" coincide con ambas entradas de texto, pero solo devuelve el valor de la primera coincidencia.
function validateForm(){ var x1= $("#textbox").val(); // first textbox, use id var x2= $("#textbox2").val(); // second textbox, use id if ($('.showother' || '.showother2').is(":visible")) { // check if either are null or empty if ( x1==null || x1=="" || x2==null || x2=="") { alert("Please fill in all text boxes"); return false; } } }Alternativamente, verifique todas las entradas de texto visibles con un bloque de código:
$("form input[type=text]").each(function() { if ( ($(this).parent().is(":visible")) && ($(this).val()==null || $(this).val()=="") ) { alert("Please fill in all text boxes"); return false; } })