jQuery : 여러 확인란 중 하나를 선택하면 유효성 검사 (jQuery 유효성 검사 플러그인을 사용하여 다른 이름)

Question

많은 확인란이있는 양식 (자체 규칙을 사용하는 것이 너무 많음)이 필요합니다. jQuery Validation Plugin을 사용하여 적어도 하나가 선택되어 있는지 확인하십시오. 그들 모두는 다른 이름을 가지고 있습니다. 그래서 지금까지 인터넷 검색으로 찾은 솔루션의 대부분은 저에게 효과적이지 않습니다.

// method for checking out checkboxes for the form validation 
$.validator.methods.checkboxes_checked = function(value,element,param) { 
    return ($('#signup #checkboxes input[type=checkbox]:checked').length > 0); 
} 

... 선택 확인란의가있는 경우 true 또는 따라 false를 반환 :

그러나, 나는이 확장 방법을 만들기 위해 조금 쥐게하는 this 포스트를 가로 질러왔다. 나는 각 체크 박스에 대해 별도의 규칙을 만들 필요가 있고, 나는 (20+ 이상) 많은 것을 가지고 있기 때문에 위의 축 어적으로부터의 방법을 사용하고 싶지 않다. 그것은 나에게별로 의미가 없다.

내 유일한 문제는 내가 페이지를 "묶는"요소가 없기 때문에 이것을 내 유효성 검사 호출에 연결하는 방법을 모르겠다는 것입니다 (다른 모든 유효성 검사 규칙 위의 확장 방법은 본질적으로 20 개 이상의 요소에 연결되지만 특정 단일 요소에 묶여 있습니다. 여기 내 검증 호출이 지금 보이는 방법은 다음과 같습니다 내 확장 방법을 제출하기 전에 true를 돌려주는 경우 양식 자체가 (JQuery와 유효성 검사 플러그인을 사용하여)을 확인하는 나는, 기본적으로 원하는

// validate the form 
$('#signup').validate({ 
    rules: { 
     'bedrooms': { required: true }, 
     'maxrent': { required: true }, 
     'term': { required: true }, 
     'movedate': { required: true }, 
     'firstname': { required: true, minlength: 2 }, 
     'lastname': { required: true, minlength: 1, maxlength: 1 }, 
     'email': { required: true, email: true }, 
     'day_telephone': { required: true, digits: true, minlength: 10, maxlength: 10 } 
    }, 
    errorPlacement: function(error, element) { error.css('display','none'); }, 
    highlight: function(element, errorClass) { 
     $(element).fadeOut(function() { $(element).fadeIn(); }); 
     $('label[for='+$(element).attr('name')+']').css('color','red'); 
    }, 
    unhighlight: function(element, errorClass) { $('label[for='+$(element).attr('name')+']').css('color','black'); }, 
    onkeyup: false 
}); 

. 이것을 어떻게 추가 할 수 있습니까?

Answer 1

나는 형식이 어떻게 보이고 오류 메시지를 원하는지 모르지만 사용자 지정 유효성 검사 방법을 추가하려고 했습니까? 아무도 없을 때 유효하지 않은 적어도 하나의 체크 박스를 선택하면

rules: { 
    'idofacheckbox' : { checkboxes: true } 
} 

이 하나 개의 체크 박스는 다음 유효합니다, 또는 :

$.validator.addMethod("checkboxes", function(value, element) { 
    return $('input[type=checkbox]:checked').length > 0; 
} 

그리고 당신의 체크 박스의 한에 대한 규칙로 추가.

Answer 2

jQuery submit()을 사용하면 유효성을 검사하기 전에 양식을 보내지 않아도됩니다.

Answer 3

$('#myform').submit(
    function(){ 
     // check the checkboxes 
     if (okay_to_submit) 
      forms['myform'].submit(); 
    } 
); 

Answer 4

Michaelk의 해결책은 내 생명을 구했습니다.

유효성을 검사하려는 확인란에 checkbox_1 클래스를 지정했습니다. addMethod를 조금 변경하십시오.

$.validator.addMethod("checkbox_1", function(value, element) { 
return $('.checkbox_1:checked').length > 0; 

} 만 담당하는 클래스를 가진 모든 체크 박스에 대한 그룹으로

오류 :

groups: { 
    checkbox_1: "checbox1 checkbox2 checkbox3" 

}

가 MICHALEK 바와 같이, 제 1 체크 박스에 규칙을 적용

rules: { 
'idofacheckbox' : { checkbox_1: true } 

}

그게 전부입니다. 위대한 작품과 단 하나의 오류가 유효성을 검사하는 모든 확인란에 대해 나타납니다.

Answer 5

$.validator.addMethod("checkboxes", function(value, element) { 
    return $('input[type=checkbox]:checked').length > 0; 
} 

일반 jQuery 표현식을 사용하는 코드는 작동하지 않을 수 있습니다. 'element'매개 변수를 반드시 사용해야합니다. 그렇지 않으면 전체/모든 확인란에 대해 전체 페이지가 쿼리됩니다.

제공된 요소를 기반으로 그룹의 다른 요소를 식별하려면 논리가 필요합니다.

아마도 '그룹'속성이 동적으로 생성 된 다음 유효성 검사기 메서드에 전달 된 경우 가장 좋은 옵션이 될 수 있습니다. 예 : "atLeastOne-checkboxes group_1"과 같은 입력 클래스를 사용하고 유효성 검사기 콜백은 function(value, element, (Array) elements_in_group) {}