1

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.

1 respuesta 1

0

Lo que tienes que hacer es seleccionar todos los fieldset, recorrerlos y en cada iteración debes preguntar si los campos obligatorios de cada fieldset están check o no para poder habilitar el botón perteneciente al fieldset.

Te recomiendo activar o desactivar la propiedad disabled usando el método .prop() el cual recupera explícitamente los valores de la propiedad.

$(document).ready(function() {
    var fieldset = $('fieldset');

    fieldset.each(function(){
      var valid = true;

      $(this).find(".obligatorios").each(function() {
         if($(this).prop("checked") == false) {
              valid = false;
         }
      });

      if(valid) {
         $(this).find('button[class="btn btn-next"]').prop('disabled', false);
      } else {
         $(this).find('button[class="btn btn-next"]').prop('disabled', true);
      }
    });
});
3
  • No me lo habilita. Sinceramente, no sé porqué.
    – Saco04
    Commented el 30 jul. 2019 a las 15:25
  • @SantiagoCorreaAguirreSanmar te sale algún error de consola o algo? esto debería funcionar Commented el 30 jul. 2019 a las 16:10
  • En realidad parece que no me sale algún error. El problema es que aún no me toma los input checkeados.
    – Saco04
    Commented el 30 jul. 2019 a las 19:43

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.