0

He creado un listado que se compone de diferentes checkbox, y un botón.

Quiero que si hay al menos un checkbox seleccionado el botón muestre "guardar" y en el único y exclusivo caso de que no haya ningún checkbox seleccionado, ponga cerrar.

He escrito este código, pero no va bien, porque si deselecciono un checkbox aunque haya otros seleccionados, me cambia el mensaje igualmente a cerrar.

$( '.Checkbox-Especifico').on( 'click', function() {
    if( $(this).is(':checked') ){
        $('#Btn-Cerrar-Especifico').attr('value', "Guardar");
    } else {
        $('#Btn-Cerrar-Especifico').attr('value', "Cerrar");
    }
});
1
  • 1
    cada vez que hagas click en un checkbox de esa clase, has de recoger todos los checkbox y mirar uno a uno su estado. Con el primer check=true que encuentres ya puedes parar el bucle y poner el value a Guardar. Si al acabar el bucle ninguno estaba a true, entonces poner Cerrar
    – lois6b
    Commented el 27 oct. 2017 a las 10:40

2 respuestas 2

4

Aunque @lois6b iba por buen camino con su comentario, igual lo puedes hacer de forma más directa sin tener que iterar por todos los checkboxes.

$("#formId input[type='checkbox'].Checkbox-Especifico").on( 'click', function() {
    if($("#formId input[type='checkbox'].Checkbox-Especifico:checked").length == 0) ){
        $('#Btn-Cerrar-Especifico').attr('value', "Cerrar");
    } else {
        $('#Btn-Cerrar-Especifico').attr('value', "Guardar");
    }
});

Aprovechando el código de ejemplo que nos pasaste, cada vez que se modifica un checkbox, comprobamos si en el formulario hay algún checkbox que no esté marcando haciendo uso del selector de jQuery :checked.

$("#formId input[type='checkbox']:checked") Esto nos debería recuperar todos los checkboxes del formulario que estuvieran marcados. Si no hay ninguno (.length == 0) entonces ponemos el valor "Cerrar" al botón, en caso contrario (hay alguno) ponemos "Guardar".

2
  • ohh claro hahah se me olvida siempre que jquery puede hacer ese tipo de consultas xD
    – lois6b
    Commented el 27 oct. 2017 a las 10:53
  • 1
    @lois6b si jeje, los selectores "trampa" de jQuery son muy útiles. Tampoco quiero ver que hace por detrás (que igual itera a pelo) para evitarme sustos xD
    – frikinside
    Commented el 27 oct. 2017 a las 10:56
1
//Escucho el evento onChange de todos los checkbox, para que funcione en todos al marcar o desmarcarlo
$( ':checkbox').on('change', function() {
    //Boton que se cambiara el texto en dependencia de la cantidad de checkbox seleccionados
    var boton = $('#Btn-Cerrar-Especifico');
    //Almaceno la cantidad de checkbox seleccionados (checked = true)
    var seleccionados = $(':checkbox:checked').length;
    //Indico el texto que va ser establecido en el boton en dependencia de los checkbox seleccionados
    var texto = (seleccionados > 0) ? "Guardar" : "Cerrar";
    //Cambio el texto del botón
    boton.attr('value', texto);
});
1
  • Ojo que sería recomendable establecer un selector anidado para que sólo nos evalúe los checkboxes de un formulario o formularios concretos no vaya a haber checks por otro sitio que nos desvirtúen el resultado y/o utilizar la clase Checkbox-Especifico que parece marcar los checksboxs que se necesitan evaluar.
    – frikinside
    Commented el 30 oct. 2017 a las 8:44

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.