jQuery 유효성 검사 - 양식과 같은 마법사의 단계에 사용하는 방법?

Question

jQuery Validation Plugin에 jQuery UI Tabs을 사용하고 싶습니다. 다음 버튼으로 트리거 된 각 단계에서 jQuery Validation Plugin을 사용하여 유효성을 검사하는 방법 나는 jQuery Validation Plugin의 예제를 보았고 대부분은 한번에 전체 폼의 유효성 검사를위한 것입니다. 나는 그것을 단계적으로 필요로한다.

저는 프로가 아니므로 다른 플러그인을 제안하는 대신 쉬운 해결책을 말해주십시오. 내 코드는 다음과 같습니다.

$("#frag1").click(function(){ 
    //I need jQuery Validation code here for a single step 
    event.preventDefault(); 
}else { 
$('.next-tab, .prev-tab').click(function() { 
     $tabs.tabs('select', $(this).attr("rel")); 
     return false; 
    }); 
} 

미리 감사드립니다.

Answer 1

다른 플러그인에 대한 제안을 원하지 않는다는 것을 알고 있습니다. 그러나 나는이 당신을 위해 특히 유용 할 수 있다고 생각 :

JQuery와 formwizard 플러그인이 있습니다, JQuery와 유효성 검사 플러그인과 잘 통합 http://thecodemine.org/

. 또한 jQuery-UI 테마로 테마화할 수도 있습니다 (이미 사이트에서 사용중인 경우).

Answer 2

다음 코드에서이 CSS 클래스가 "ui-tabs-hide"가 아닌 조각을 확인하십시오. 그런 다음 모든 입력 및 확인란에 대해 곧 동일한 CSS 클래스 (예 : - "myinputs")를 적용 해보십시오. 그런 다음 현재 "조각"div 입력 유효성 검사에 대한 유효성 검사를 적용합니다.

예를 들면 : - 이면 2 단계입니다.이 div "fragment-2"에는 CSS 클래스 "ui-tabs-hide"가 없습니다. 이 클래스가 다른 다이빙에 적용된 것을 볼 수 있습니다.

따라서 현재 활성 div ID를 가져 오십시오 (여기서는 "fragment-2"입니다). 그런 다음이

http://docs.jquery.com/Plugins/Validation/Validator/element#element

$("#myform").validate().element("#myselect"); // here there are passing element ID 

$("#myform").validate().element('#'+ CurrentFragment + '.myinputs'); //here we are passing current fragment css class inputs. 

좋아한다 나는 그것이 CSS 클래스를 받아 들일 것입니다 확실하지 않다. 그러나 한 번 시도해보고 다른 요소를 반복하지 않고 거짓 요소와 return false을 처리하십시오. 따라서 사용자는 값을 설정할 때까지 다음 조각으로 이동하지 않습니다.

나는 이것이 최선의 방법인지 확신하지 못합니다. 해당 유효성 검사 플러그인에 대해 많은 지식이 없습니다.