jQuery在选择列表上验证的问题

Question

我已经看过很多关于如何在选择列表上使用jQuery验证的示例—我正在尝试实现一个，但它不适合我。总的来说，我对这个插件很陌生，我完全不知道我做错了什么。

预期的行为是，如果用户将选择菜单留在"默认"状态，则不应该验证。他们必须做出选择。

我首先连接新的验证器方法。

<标题> Javascript h1> 后将元数据添加到实际的HTML中。 <标题> HTML

<form id="form1" action="">
<select id="select_list" data-val="true"
        data-val-mustbe="You must select a value"
        data-val-mustbe-condition="0"
        data-val-mustbe-propertyvalue="default"
        data-val-required="You must select a value" >
        <option value="default">Choose...</option>
        <option value="1">1</option>
        <option value="2">2</option>
</select>
<input type="submit" id="submit" value="Submit" />
</form>​

它拒绝验证。这里也有一个小提琴的链接:

<标题> jsFiddle

Answer 1

你应该告诉你正在使用ASP。净MVC。这不会有帮助，但人们会停止询问自定义属性名。

我已经重新设计了你的代码与默认值和你的数据-val属性工作。这是一个代码示例:

$(document).ready(function() {    
    $.validator.addMethod("valueNotEquals", function(value, element, arg){
        return arg != value;
    }, "");
    $("#form1").validate({
        rules: {
            select_list : {valueNotEquals: $('#select_list').attr('data-val-mustbe-propertyvalue')},  
        },
        messages: {  
            select_list : { valueNotEquals: $('#select_list').attr('data-val-required') }
        },        
        submitHandler: function(form) {
            alert($('#form1').valid());
            form.submit();
        }
    });
});

EDIT:

这里有一个jsFiddle的例子:http://jsfiddle.net/Gajotres/ekPpS/

这是一个没有ASP的版本。. NET MVC属性:

<form id="form1" action="">
    <select id="select_list" name="select_list">
            <option value="default">Choose...</option>
            <option value="1">1</option>
            <option value="2">2</option>
    </select>
    <input type="submit" id="submit" value="Submit" />
</form>
$(document).ready(function() {    
    $.validator.addMethod("valueNotEquals", function(value, element, arg){
        return arg != value;
    }, "");
    $("#form1").validate({
        rules: {
            select_list : {valueNotEquals: "default"},  
        },
        messages: {  
            select_list : { valueNotEquals: "You must select a value" }
        },        
        submitHandler: function(form) {
            alert($('#form1').valid());
            form.submit();
        }
    });
});

Answer 2

简单的方法是在默认选项中使用value=''，并指定select是必需的:

<select id="select_list" class="required">

Answer 3

所以Barmar的答案是部分正确的，但没有很好地解释。

我所做的更改使这个更新的小提琴工作:

添加name="select_list"到select元素本身来给jquery。验证它要查找的内容

修改了javascript validate调用:

$("#form1").validate({
  rules: {
    select_list: {
      required: true,
      number: true
    }
  },
 submitHandler: function(form) {
   alert($('#form1').valid());
   form.submit();
 }
});