2009-06-20 8 views
3

기본적으로 저는 선택한 국가별로 다른 양식 및 유효성 검사 기능을 제공해야하는 웹 양식을 작성하고 있습니다. 여기Jquery 유효성 검사 플러그인 및 전환 필수 입력란

<script type="text/javascript" src=" jquery-1.3.2.min.js" charset="utf-8"></script> 
<script type="text/javascript" src=" jquery.validate.js" charset="utf-8"></script> 

등을 사용하고

다음
<script type="text/javascript" charset="utf-8"> 
function updatRequreForm (STATE,ZIPCODE) { 
    $("#frm_verification").validate({ 
      rules: { 
       'form[country]' : "required", 
       'form[state]' : {required: STATE}, 
       'form[zip]': {required: ZIPCODE}, 
       }, 

      messages: { 
       'form[country]' : "This field is required.", 
       'form[state]' : "This field is required.", 
       'form[zip]': "This field is required.", 
     }); 
}; 


function setRequreForm() { 
    var _cs = $('#country_select')[0]; 

    if ('US' != _cs.value) 
    { 
     $('#state_star')[0].innerHTML = ''; 
     $('#zip_star')[0].innerHTML = ''; 
     updatRequreForm (false,false); 
    } 
    else 
    { 
     $('#state_star')[0].innerHTML = '*'; 
     $('#zip_star')[0].innerHTML = '*'; 
     updatRequreForm (true,true); 
    } 
};  


$(document).ready(function() { 
    setRequreForm(); 
    $('#country_select').change(function(){ 
     setRequreForm(); 
    }); 
}); 

</script> 

내 HTML 내 JS 코드 :

<form id="frm_verification" action="some.php" method="POST"> 

<label for="country_select"><sup>*</sup>Country:</label> 
<select name="form[country]" id="country_select"> 
    <option value="">- Select -</option> 
    <option value="US" selected="selected">United States</option> 
    <option value="ZM">Zambia</option> 
    <option value="ZW">Zimbabwe</option> 
</select> 


<label for="select-state"><sup id="state_star">*</sup>State/Province/Region:</label> 
    <span id="states_select"> 
     <select id="select-state" name="form[state]"> 
      <option value="">- Select -</option> 
      <option value="AK">Alaska</option> 
     </select> 
    </span> 

    <span id="states_text" style="display:none;"> 
    <input type="text" name="form[state]" value="" id="state" /> 
    </span> 

<label for="zip_code"><sup id="zip_star">*</sup>ZIP/Postal Code:</label> 
<input type="text" id="zip_code" name="form[zip]" value="" id="zip"> 

<input type="submit" value="Submit" id="submit_btn" class="submit"> 
</form> 

바 sically, 내가 만들어야하는 것입니다 :

1.When user select US on country selection, the State and Zip area become required. 
2.When user select Zambia on country selection, the State and Zip area become non-required. 

문제 : 내가 처음 페이지를로드 빈 필드가 제출 버튼을 클릭하면

는 양식이 성공적으로 각 필드를 확인하고 경고를 보여줍니다. 그러나 잠비아를 선택하면 유효성 확인이 제대로 작동하지 않습니다.

$(document).ready(function() { 
    //setRequreForm(); 
    $('#country_select').change(function(){ 
     setRequreForm(); 
    }); 
}); 

그리고 잠비아를 선택하려고하고 양식을 검증하기 위해 시도하고 작동합니다;

추측처럼 준비 기능의 "setRequreForm()"를

나는 제거했습니다. 그래서 "validate()"를 두 번 호출하면 오류가 발생한다고 생각합니다. 글쎄, 나는 이걸로 한동안 붙어있다. 이 점을 이해하도록 도와주세요. 정말 감사하겠습니다.

답변

5

유효성 검사 플러그인을 두 개 이상 실행하면 오류가 발생하므로 둘 이상의 유효성 검사를 호출 할 수 없습니다. 당신은 설정 할 수

이처럼 검증 :

$("#myform").validate({ 
    ignore: ".ignore" 
}) 

무시는 검증 알려줍니다 : CSS 클래스를 무시가 필드의 유효성을 검사 할 수 없습니다.

당신이 요구 사항은 다음 지정된 필드의 CSS 클래스에 추가 변경

"무시"
$("#field1").addClass("ignore"); 

그렇지 않으면이 클래스를 제거합니다

$("#field2").removeClass("ignore"); 
+0

덕분에, 그것을 작동합니다. ;-) – chris

+0

문제는 없습니다. 제발,이 답변을 대답으로 표시하십시오 :) – dariol

관련 문제