JQuery验证时选择

如何选择框时验证其他字段。我已经尝试了下面，但无济于事。我只想在选择Horse或Pony时验证AnimalName2。在此先感谢。JQuery验证时选择

HTML：

<select class="vars" data-hint="" name="Registration2"> 
    <option data-price="0.00" selected="selected" value=""> 
    None 
    </option> 

    <option data-price="5.00" value="Horse"> 
    Horse 
    </option> 

    <option data-price="5.00" value="Pony"> 
    Pony 
    </option> 
</select> <span class="clear">clear</span> 

<div class="quarter"> 
    <label style="font-weight: bold; display: inline;">Name</label><br> 
    <input autocomplete="off" data-hint="" maxlength="254" name="AnimalName2" 
    placeholder="" type="text"> 
</div>

我使用jquery.validate.min.js

<script> 
(function($, W, D) { 
    var JQUERY4U = {}; 
    JQUERY4U.UTIL = { 
     setupFormValidation: function() { 
     //form validation rules 
     $("#addriderform").validate({ 
      rules: { 
      AnimalName2: { 
       required: "Registration2:selected" 
      }, 
      agree: "required" 
      } 
      submitHandler: function(form) { 
      form.submit(); 
      } 
     }); 
     } 
    } 
    //when the dom has loaded setup form validation rules 
    $(D).ready(function($) { 
    JQUERY4U.UTIL.setupFormValidation(); 
    }); 
})(jQuery, window, document); 
</script>

来源

2014-07-22 user3052324

我加入了答案，U可以检查出来？ –

是的，这工作完美！非常感谢你。 – user3052324

什么是AB？ :) –

给id来下拉菜单中，使用jQuery的depends参数验证：

工作小提琴HERE

HTML

<form id="addriderform" method="post"> 
<select class="vars" data-hint="" name="Registration2" id="Registration2"> 
    <option data-price="0.00" selected="selected" value=""> 
    None 
    </option> 

    <option data-price="5.00" value="Horse"> 
    Horse 
    </option> 

    <option data-price="5.00" value="Pony"> 
    Pony 
    </option> 
</select> 
    <span class="clear">clear</span> 

<div class="quarter"> 
    <label style="font-weight: bold; display: inline;">Name</label><br> 
    <input autocomplete="off" data-hint="" maxlength="254" name="AnimalName2" 
    placeholder="" type="text"/> 
    <input type="submit"/> 
</div> 
    </form>

jQuery的

//form validation rules 

    $("#addriderform").validate({ 
     rules: { 
     AnimalName2: { 
      required: { 
       depends: function(element) { 
        if($("#Registration2").val() != "")//If Pony or Horse selected 
        { 
        return true; 
        } 
        else 
        { 
        return false; 
        } 
       } 
      } 
     }, 
     //Registration2:{required:true} 
     }, 
    messages: { 

     AnimalName2: { 
      required: "Please fill TEXTBOX" 
     }, 
     Registration2:{ 
      required: "Please select DROPDOWN ."  
     } 

    }, 
    errorPlacement: function(error, element) { 
     error.appendTo(element.parent()); 
    }, 

     submitHandler: function(form) { 
     form.submit(); 
     } 
});

这意味着 “AnimalName2” 这个文本框需要属性取决于其内部的条件。查看下面它检查是否选择“None”.IF从下拉菜单中选择无，返回false，意味着必需属性变为false，否则变为true，所以验证适用于文本框。

function(element) { 
        if($("#Registration2").val() != "")//If Pony or Horse selected 
        { 
        return true; 
        } 
        else 
        { 
        return false; 
        } 
       }

如需更多信息，请检查HERE

来源

2014-07-23 04:41:10

嗨，你可以做+1 Upvote如果问题解决了，谢谢:) –

JQuery验证时选择

回答

相关问题