2014-01-23 4 views
1

두 개의 필드, 드롭 다운 목록 및 텍스트 상자가있는 양식이 있습니다. 드롭 다운과 텍스트 상자는 모두 필수 항목이지만 사용자가 "기타"를 선택하면 텍스트 상자는 필수 항목이 아니며 별표가 표시되지 않습니다.Prototype JS를 사용한 조건부 필드 유효성 확인

형태 :

<form method="post" id="configForm" action=""> 
    <div class="field"> 
     <label class="required" for="type"><em>*</em>Type</label> 
     <div class="input-box"> 
      <select name="type" class="required-entry"> 
       <option value=""></option> 
       <option value="A">A</option> 
       <option value="B">B</option> 
       <option value="C">C</option> 
       <option value="Other">Other</option> 
      </select> 
     </div> 
    </div> 
    <div class="field"> 
     <label class="required" for="price"><em>*</em>Price</label> 
     <div class="input-box"> 
      <input type="text" value="" name="price" class="required-entry"> 
     </div> 
    </div> 
</form> 

스크립트 : 내 자신의 질문에 대답하면서

<script type="text/javascript"> 
    //< ![C 
    var Form= new VarienForm('configForm', true); 
    //]]> 
</script> 

답변

2

그 어색한 느낌하지만 난 그것을 해결로 다른 사람을 도울 수 있기 때문에 자신이 너무 게시.

<script type="text/javascript"> 
    //< ![C 
    Validation.add('conditional-required', 'This is a required field.', function(v) { 
     var type = $('type').getValue(); 
     if(type == 'Other') 
     { 
      return ((v != "none") && (v != null) && (v.length != 0)); 
     } 
     else 
     { 
      return true; 
     } 

    });  
    //]]> 
</script> 

필드를 텍스트

<input type="text" value="" name="price" class="conditional-required"> 

매우 간단하기

<select name="type" class="required-entry" id="type"> 

목록을 드롭 다운 클래스 conditional-required을 추가하는 ID type 추가!

관련 문제