Jquery Checkbox Input Validation

Question

У меня есть следующий флажок

<input type="checkbox" name="compare[]" value="<?php echo $product_id ?>" /> 

Теперь я хочу, чтобы мои пользователи выбирают минимум три и максимум три опции из выше флажка. Нарушение любого из правил даст сообщение.

Не могли бы вы любезно помочь мне, как это сделать с JQuery?

Спасибо заранее

Answer 1

Попробуйте этот плагин: http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Answer 2

Вы можете перебирает ваш флажок, используя jQuery.each(), проверка проверяемых элементов и добавление проверки к отсчету. Затем, если счетчик не равен 3, вы можете вывести сообщение об ошибке проверки.

$(function(){ 
$("#frm").submit(function(){ 
    var checkCount = 0; 
    var min = 3; 
    var max = 3; 

    // iterate over checkbox's using jquery each() 
    // use jquery's attribute contains selector (http://api.jquery.com/attribute-contains-selector/) 
    // to grab the compare portion of the checkbox field name 
    $("input[name*='compare']").each(function(k, v) { 

    // increment check count when a checked checkbox is found 
    if($(this).is(":checked")) 
     checkCount++; 
    }); 

    //validate checkbox count against predefined range 
    if(checkCount < min || checkCount > max) 
    { 
     console.log("Checkbox Validation Failed"); 
     return false; 
    } 
    else 
     console.log("Checkbox Validation Passed"); 

}); 
}); 

Answer 3

Вот 1 решение

var $chkbox = $('input[name=compare]'); 
$chkbox.click(function (e) { 
    if ($chkbox.filter(':checked').length > 3) { 
     e.target.checked = false; 
    } 
}); 

http://jsfiddle.net/H96nz/

var $chkbox = $('input[type="checkbox"]'); 

$chkbox.click(function (e) { 
    if ($chkbox.filter(':checked').length > 3) { 
     e.target.checked = false; 
    } 
});