jquery 단일 양식의 여러 섹션에 대한 동작을 처리하는 데 유효성 검사가 어려움

Question

여러 섹션이있는 양식이 있으며 단일 양식 내의 섹션 유효성 검증 동작을 독립적으로 처리 할 수 ​​없습니다.

이 예제에서는 http://jsbin.com/ojihiv/4/edit입니다. 섹션 1에는 2 개의 섹션이 있는데, 섹션 2에서 섹션에 표시 오류 메시지를 표시해야합니다. 입력 요소의 제목으로 오류 메시지를 표시해야합니다.

예와 관련된 문제는 항상 처음 선택한 동작이 이후에 적용됩니다. 이것은 아래와 같이 테스트 할 수 있습니다.

사례 1 : 데이터를 입력하지 않고 validateemail을 클릭하면 섹션 수준 오류 메시지가 표시되고 지금 validatename을 클릭합니다. 이제 오류 메시지가 제목으로 표시되어야합니다. 여기서 오류 메시지는 섹션으로 표시됩니다. 오류 메시지가 제목으로 표시되는 데이터를 입력하지 않고 validatename을 클릭하고 이제 오류 메시지가이 제목으로 오류를 표시 같은 섹션으로 표시했는데 validateemail 클릭 :

페이지

에게 사례 2를 새로 고칩니다.

나를 도와주세요.

Answer 1

div 태그에 텍스트 상자 넣기

나는 유효성 검사를위한 예제를 제공했으며, 오류 메시지는 "가장 가까운"div에 표시됩니다.

$("#prRegistration").validate({ 
    rules: { 
     user_name: { 
      required: true, minlength: 2 
     } 
    }, 

    messages: { 
     user_name: { 
      required :"Please enter first name" 
      // minlength:"" 
     } 
    }, 
    errorPlacement: function(error, element) {error.insertAfter(element.closest("div"));} 
});