2013-04-23 2 views
0

jQuery 유효성 검사를 사용하여 유효성을 검사하는 간단한 양식이 있으며 전에는 본 적이없는 문제가 있습니다. 유효성 검사 요약을 사용하여 유효성을 검사하는 컨테이너에 래핑 된 양식이 있고 컨테이너의 전체 내용이 사라지는 탭 중 하나에 성공적으로 유효성 검사 및 일부 정보를 입력하면 사라집니다. . 나는 다음과 같은 코드/jsFiddles에서이 동작을 볼 수는 양식에있는 컨테이너를 일치 래퍼 속성과 관련이있다 생각 :jQuery 유효성 검사 - 양식이 성공하면 사라집니다.

$('#form1').validate({ 
     wrapper: 'p', 
     errorContainer: '#jserror', 
     errorClass: 'jserror', 
     errorLabelContainer: '#ValidationErrors', 
     highlight: function(element, errorClass) { 
      $(element).addClass('errorfields'); 
     }, 
     unhighlight: function(element, errorClass) { 
      $(element).removeClass('errorFields'); 
     }, 
     rules : {}, 
     messages: { 
      name: { 
       required: "Name is required" 
      }, 
      postSlug: { 
       postSlug: "Can only contain numbers, letters, dashes and underscores", 
       required: "Post slug is required" 
      } 
     } 
    });// end validate 

양식 및 제목 UL/리튬에 싸여 있으며, 래퍼 설정시 그 내용이 완전히 사라 '리'를 양식 및 제목 DIV에 싸여, 그리고 래퍼 설정할 때 그 내용이 완전히 없어진다 http://jsfiddle.net/tjans/cqXXu/41/

: 양식 및 제목 DIV에 싸여있다 http://jsfiddle.net/tjans/cqXXu/44/

'사업부를' 래퍼가 'p'로 설정되고, 모든 것이 잘 작동합니다. http://jsfiddle.net/tjans/cqXXu/45/

버그입니까? 그렇지 않으려면 더 나은 구문이 있습니까?

+0

"래퍼 설정시 사라집니다"- 필수 항목에만 해당 - 올바르지 않은 이메일 주소를 먼저 입력하십시오. –

+0

필수 입력란에만 맞춰주세요 ... – tjans

답변

1

문제는 해당 플러그인이 errorLabelContainer의 부모에게 display:none을 설정하고 있다는 것입니다.

대신이 방법을 시도 ...

HTML :

<div id="ValidationErrors" class="messageContainer validation" style="display:none;"> 
    <ul></ul> 
</div> 

검증 옵션 :

errorLabelContainer: '#ValidationErrors ul', 

DEMO : http://jsfiddle.net/uWVZ9/


이 글은 당신의 문제와 아무런 관련이 없습니다. 그러나 나는 빈칸을 제거 할 것입니다. 결코 좋은 아이디어는 아니며 규칙이 이미 HTML과 인라인으로 정의되어 있기 때문에 완전히 불필요합니다.

+0

저기요, 그게 다야. 나는이 작업의 다른 코드에서 오래된 예제를 살펴 보았습니다. 유효성 검사 오류를 해결하기 위해 항상 div가 있었기 때문에 지금까지는이 문제에 대해 전혀 언급하지 않았습니다. 도움을 주셔서 감사합니다 ... – tjans

+0

또한 단순히 div의 ValidationErrors 컨테이너를 감싸고 다른 것을 변경하지 않고 동일한 효과를 얻을 수 있습니다. – tjans

관련 문제