带原型JS的条件字段验证

Question

我有一个包含两个字段，一个下拉列表和一个文本框的表单。下拉菜单和文本框都是强制性的，但有一个例外，如果用户选择“其他”，文本框将不是强制性的，并且不会显示星号。

表：

<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> 

Answer 1

它觉得尴尬而回答我的问题，但我解决它自己，所以张贴，因为它可以帮助别人。

<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> 

添加ID type到下拉列表中

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

添加conditional-required类文本字段

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

相当简单！