JQuery <select><select> 동시에 확인

Question

세 개의 선택 상자가 포함 된이 양식은 하루에 한 개, 한 달에 한 개, 한 해에 한 개씩 있으며이 양식에 올바르게 유효성 검사를 시도하고 있습니다. .

<select>의 부모에게 클래스를 추가하는 방법을 사용하여 유효성을 나타내는 측면에 녹색 점이 표시되도록했습니다.

이제 사용자가 연도 또는 월만 입력 할 때마다 다른 필드 중 하나가 null로 설정되어 있어도 '유효한'클래스가 부모로 설정됩니다.

내가하는 일과 관련하여 또 다른 문제는 양식의 유효성을 검사 할 필요가 없다는 것입니다. 그러나 생년월일을 입력하고 싶다면 그렇게 할 수 있습니다.

따라서 달성하려고하는 것은 사용자가 <select> 세 개 중 하나 이상을 입력 할 때만 <select>에 대한 유효성 검사를 시작하고 사용자가 아무 것도 입력하지 않으면 양식의 유효성이 계속 검사됩니다. 나는이 질문에 오히려 irrellevant 때문에

jQuery.validator.addMethod('selectcheck', function (value) { 
    return (value != 'null'); 
}, "value required"); 

$("#registrationform").validate({ 
    rules: { 
     dayofbirth:{selectcheck:true,}, 
     monthofbirth:{selectcheck:true,}, 
     yearofbirth:{selectcheck:true,} 
    } 
    highlight: function (element) { 
     $(element).parent().addClass('error').removeClass('valid').closest('.form-group').addClass('error').removeClass('valid'); 
    }, 
    unhighlight: function (element) { 
     $(element).parent().addClass('valid').removeClass('error').closest('.form-group').addClass('valid').removeClass('error'); 
    } 
}); 

나는 그 같은 오류 메시지 및 기타 물건을 추가하지 않은 :

이

내가 지금까지 함께했다 코드입니다.

편집 : 날짜가 selectcheck 메서드를 호출하지 않도록 코드를 변경했습니다.이 메서드는 다른 체크 박스에 대해서만 사용 중이므로 사용할 수 있습니다. 이제는 날짜 만 유효성 검사하는 새로운 방법을 제안하려고합니다.

Answer 1

간단한 required 규칙이 이미 수행 할 수있는 사용자 지정 방법을 만든 이유가 확실하지 않습니다.

<select name="month" class="date"> 
    <option value="">please select month...</option> 
    <option value="1">January</option> 
    <option value="2">February</option> 
    .... 
</select> 

다음이 사용할 수

당신의 HTML이 처음 option이 value="" 포함 곳처럼 보인다면

...

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      month: { 
       required: true 
      } 
     } 
    }); 

}); 

DEMO : http://jsfiddle.net/KE9SU/

---

또는 그룹으로 검증하려면 the additional-methods.js file에 포함 된 require_from_group 메소드를 사용할 수 있습니다.

$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      month: { 
       require_from_group: [3, '.date'] 
      }, 
      day: { 
       require_from_group: [3, '.date'] 
      }, 
      year: { 
       require_from_group: [3, '.date'] 
      } 
     }, 
     groups: { 
      dateGroup: 'month day year' 
     } 
    }); 

}); 

DEMO : 자동 스타일을 오류 요소를 목표로하고 지금 적절한 규칙을 사용하여 http://jsfiddle.net/KE9SU/1/이

, 쉽게해야합니다.