Jquery detener el envío de formulario a menos que haya seleccionado la casilla

Question

Tengo este código, pero parece que no es verdadero. La alerta siempre aparece. Cualquier idea (sin necesidad de crear una var en la que almacenar esa casilla de verificación ha sido seleccionada ya que parece un poco hacky).

Gracias.

$("#form").submit(function(e) { 
    $('input[type=checkbox]').each(function() { 
     if(this.checked){ 
      return true; 
     } 
    }); 
    alert("Please select at least one to upgrade."); 
    return false; 
}); 

Answer 1

No necesita hacer el ciclo para determinar si una casilla de verificación está marcada. El selector :checked filtra todo lo que no está marcado. Luego puede usar $.length para obtener un conteo de las entradas marcadas.

$("#form").submit(function(e) { 
    if(!$('input[type=checkbox]:checked').length) { 
     alert("Please select at least one to upgrade."); 

     //stop the form from submitting 
     return false; 
    } 

    return true; 
}); 

Además, la utilización de su enfoque, un pequeño cambio debería hacer este trabajo

$("#form").submit(function(e) { 
    $('input[type=checkbox]').each(function() { 
     if($(this).is(':checked')){ 
      return true; 
     } 
    }); 
    alert("Please select at least one to upgrade."); 
    return false; 
}); 

Creo que es posible que simplemente echa en falta la $() alrededor this

Answer 2

Ejemplo de comprobar el número de checboxes controladas ...

<script> 

    function countChecked() { 
     var n = $("input:checked").length; 
     $("div").text(n + (n <= 1 ? " is" : " are") + " checked!"); 
    } 
    countChecked(); 
    $(":checkbox").click(countChecked); 

</script> 

Por encima de "$ (" Entrada: marcado ")" devuelve el conjunto de elementos seleccionados ... Usted puede marcar la casilla " length "de esta matriz por ser> 0.

Answer 3

Solo para señalar, está utilizando la referencia de id #form. ¿Quiso referirse simplemente a todos los formularios, o tiene el formulario el ID form?

Answer 4

Código de clic y entrar en el botón de envío :

$(":input").bind("click keypress", function(evt) { 
    var keyCode = evt.which || evt.keyCode; 
    var sender = evt.target;     
    if (keyCode == 13 || sender.type == "submit") {       
     evt.preventDefault(); 
     // add your validations 
    } 
    // and submit the form 
} 

Answer 5

var atleast = 1; 
function validate() { 
    debugger; 
    var CHK = document.getElementById("<%=chk1"); 
    var checkbox = document.getElementsByTagName("input"); 
    var counter = 0; 
    for (var i = 0; i < checkbox.length; i++) { 
     if (checkbox[i].checked) { 
      counter++; 
     } 
    } 
    if (atleast > counter) { 
     alert("Please select atleast " + atleast + " employee "); 
     return false; 
    } 
    return true; 
} 

<button type="submit" name="Initiate" value="Initiate" on click="return validate()" id=" initiate"></button>