2014-09-17 1 views
0

나는 5 개의 div가있는 하나의 양식을 가지고 있습니다. 하나는 항상 볼 수 있습니다. 다른 네 style="visibility:hidden; position: absolute;"를 사용하여 숨겨진 유지, 및 방법을 추가 호출하고 수행하여 표시 할 수 있습니다숨겨진 div의 유효성 검사 필드를 건너 뛰는 방법

.css("visibility","visible")`) 

에 클릭 몇 가지 링크 및 remove 메소드를 호출하고 수행하여 제거 할 수 있습니다 :

.css("visibility","hidden");` 

도 마찬가지이다.

모든 div에는 동일한 수의 입력 필드 (즉, 2 개의 입력 필드)가 있습니다.

그러나 페이지를 제출할 때 아무 일도 일어나지 않고 다음 div (addNewDiv 링크를 클릭하면)를 표시 할 때 해당 필드 옆에 두 개의 필드 ("이 필드가 필요합니다.")가 빨간색으로 표시됩니다 .

나는 style="display:none"와 시도했지만 작동하지 않았고, 아래의 방법도 작동하지 않았다 :

$('#myFormId').validate({ 
     ignore: ":hidden" 
}); 

난 정말 여기에 코드를 게시 할 수 없습니다. 세미콜론 (:) JQuery와의 속성과 숨겨진는 CSS 규칙이기 때문에

답변

3

, 당신과 같이 무시하고 모든 숨겨진 필드에 클래스를 추가하고 클래스를 추가하는 동안 다음 대신 클래스를 전환 할 것 :

$('#myFormId').validate({ 
    ignore: ".hidden" 
}); 

.hidden 
{ 
    visibility: hidden; 
} 
+0

답장을 보내 주셔서 감사합니다. 이 @ 애드리안을 사용해 보도록하겠습니다. 한 가지 간단한 질문입니다.이 클래스를 DIV에 추가하면 전체 DIV는 건너 뛸 것입니다. 그렇습니까? – Jaikrat

+0

아마 당신은 다음을 사용해야 할 것입니다 : ".hidden input"을 셀렉터로 무시하십시오. –

+0

좋습니다, 시도하겠습니다. 감사합니다 – Jaikrat

0

이 사람은 잘

<form id="myform"> 
    <input type="text" name="field1" /> 
    <br/> 
    <input type="text" name="field2" style="display:none;" /> 
    <br/> 
    <input type="submit" /> 
</form> 


$(document).ready(function() { 

    $('#myform').validate({ 
     rules: { 
      field1: { 
       required: true 
      }, 
      field2: { 
       required: true 
      } 
     }, 
     submitHandler: function (form) { // for demo 
      alert('valid form'); 
      return false; 
     } 
    }); 

}); 

a { 
    display: block; 
    position: absolute; 
    bottom: 0; 
} 

데모는 HTML5가 시간 인 폼 요소에 필수 속성이 있다고 나는 생각하고 here!

+0

내 div에 내가 몇 가지 입력 상자를 동적으로 추가하기 때문에 정말이 하나를 사용할 수 없습니다. 그러나 그 아이디어에 감사드립니다. – Jaikrat

1

입니다 작동 숨김. 필요한 곳에 이것을 넣고 정적 필수 속성을 제거하십시오. 백엔드에서도 멀티 폼이 까다로울 수 있습니다. 따라서 프런트 엔드에 따라 유효성 검사를 설정했는지 확인하십시오.

$('#fieldID').prop('required',true); 
+0

내 div에서 동적으로 입력 상자를 몇 개 추가하기 때문에 실제로이 파일을 사용할 수 없습니다. 그러나 그 아이디어에 감사드립니다. – Jaikrat

관련 문제