Tenho um série de questionários em que todos os campos devem ser respondidas obrigatoriamente, o problema é que alguns inputs não estão como campo obrigatório, como no exemplo abaixo:
O input
de tipo text
não está passando pela validação e ele é ignorado (pula-se direto para a próxima questão sem validar esse input de texto).
Continuando sobre a questão A
, se eu colocar esse input de texto acima do input radio com o valor = SIM, o input de texto passa a ter validação e o input de radio não é validado (pula-se para a próxima questão).
<!-- INICIO PERGUNTA A -->
<div class="questao questao-A">
<p class="pergunta">A - PG A
</p>
<div class="split-list">
<ul class=" list-group">
<li class="list-group-item list-group-item-success">
<label><input type="radio" name="pgA" value="SIM" /> SIM </label>
<p class="alert alert-success pgA_qual"><label>Qual ? </label>
<input type="text" name="pgA_qual" class="form-control" value=""/>
</p>
</li>
<li class="list-group-item list-group-item-success"><label><input type="radio" name="pgA" value="NÃO" /> NÃO </label></li>
</ul>
</div>
</div>
<!-- FIM PERGUNTA A -->
$(".bloco-atual").find(".questao").each(function(){
var __thisQuestao = $(this);
var __thisElement =__thisQuestao.find(":input");
var thisElementoType = __thisElement.attr("type");
var thisElementoName = __thisElement.attr("name");
// TIPO INPUT
if(thisElementoType === 'radio') {
if($("[name='"+thisElementoName+"']").is(":checked")){
//faz algo
} else {
alert("n checkado");
scrollTop(__thisQuestao);
return false;
}
} else
if(thisElementoType === 'text') {
alert(thisElementoName);
if($("[name='"+thisElementoName+"']").val() === ""){
alert("valor vazio");
scrollTop(__thisQuestao);
return false;
}
}
// TIPO TEXTAREA
var thisName =__thisQuestao.find("textarea").attr("name");
if($("[name='"+thisName+"']").hasClass("obriga")){
if($("[name='"+thisName+"']").val() === ""){
alert("valor vazio");
scrollTop(__thisQuestao);
return false;
}
}
});
Segue o jsfiddle do problema: https://jsfiddle.net/6rzn6vjg/