Estoy realizando una página web que realiza una encuesta por pasos. Para eso, divido cada sección de preguntas con unos <fieldset></fieldset>
. Hay campos que son obligatorios, y para eso, inhabilito todos los botones con jQuery.
Al llenar los campos obligatorios, el botón se habilita para seguir al siguiente <fieldset>
y proseguir con las demás preguntas (son 9 fieldset).
Al iniciar el documento, inhabilito los botones con esta línea:
$("fieldset").find('button[class="btn btn-next"]').attr('disabled', 'disabled');
Al momento de llenar los campos obligatorios, se habilitan los botones con este código:
$(document).on("click", ".obligatorios", function() {
var fieldset = $(this).parents('fieldset');
var valid = true;
fieldset.find(".obligatorios").each(function() {
if($(this). prop("checked") == false) {
valid = false;
}
});
if(valid) {
$(fieldset).find('button[class="btn btn-next"]').removeAttr('disabled');
} else {
$(fieldset).find('button[class="btn btn-next"]').attr('disabled', 'disabled');
}
});
Intento que al iniciar el documento, se me habiliten lo botones a los cuales ya se llenaron los campos. Es decir, si empiezan en el fieldest número 4, los botones de los fieldset 1, 2 y 3 se habiliten. He intentado con este código:
$(document).ready(function() {
var fieldset = $(document).parents('fieldset');
var valid = true;
fieldset.find(".obligatorios").each(function() {
if($(this). prop("checked") == false) {
valid = false;
}
});
if(valid) {
$(fieldset).find('button[class="btn btn-next"]').removeAttr('disabled');
} else {
$(fieldset).find('button[class="btn btn-next"]').attr('disabled', 'disabled');
}
});
Es casi el mismo de arriba, pero no me habilita los botones. Quisiera saber cómo podría resolver ese problema, por favor.
De antemano, gracias.