0

根据此处接受的答案,这是我必须做的才能使所需的选择与验证一起工作。

我已经在jsfiddle上创建了一个示例,但我无法让它工作。

主要区别在于我的默认值只是空(“”)。

<form id="myform">
    <select id="id_deals-0-currency" class="required" name="deals-0-currency">
    <option value="">---------</option>
    <option selected="selected" value="1">USD - $</option>
    <option value="2">EUR - €&lt;/option>
    </select>
</form>

$(function() {
    $(document).ready(function() {

        $.validator.addMethod("valueNotEquals", function(value, element, arg) {
            return arg != value;
        }, "Value must not equal arg.");


        $("#myform").validate({
            rules: {
                deals-0-currency: {
                    valueNotEquals: ""
                }
            },
            messages: {
                deals-0-currency: {
                    valueNotEquals: "Please select an item!"
                }
            }

        });
    });
})
4

2 回答 2

2

您的代码有效,但您需要将其引用 deals-0-currency为对象键,并且您的空字符串默认值被required该类取代,这使得该项目在验证中是必需的。空值将始终首先触发所需的消息,并且您的验证方法将永远不会被当前默认值触发""

$("#myform").validate({           
    rules: {
        'deals-0-currency': {
            valueNotEquals: ""
        }
    },
    messages: {
        'deals-0-currency': {
            valueNotEquals: "Please select an item!"
        }
    }
});

演示(已删除所需的类)http://jsfiddle.net/WGL4j/7/

编辑:要在更改时验证选择,请使用validator valid()只能在整个表单或单个元素上调用的方法:

 $('#id_deals-0-currency').change(function(){
            $(this).valid()
})

更新演示:http: //jsfiddle.net/WGL4j/8/

于 2012-12-23T14:07:34.170 回答
0

首先...您没有编写有效的 JavaScript。你的名字不能有破折号!切换到“_”或引用名称,它将是有效的。请记住始终通过JSLintJSHint之类的工具运行 JavaScript 。

您的代码中的另一个奇怪之处是您有一个$(function(){}) handler和一个$(document).ready(function(){})处理程序嵌套在彼此内部。这不会破坏您的代码,但没有必要。

在选择值更改时检查验证,您将需要手动调用验证。 JQuery Validation 附带了valid执行此操作的方法。更新您的 ready 函数以包含此行。

$('id_deals-0-currency').on('change', function() { $('#myform"').valid(); });

好的,现在更改全部到位,最终代码应如下所示(此处为整个工作 jsFiddle):

<html>
<head>
<script src="/path/to/jquery-1.8.3.min.js"></script>
<script src="/path/to/jquery.validate.js"></script>
<script>
$(function() {
    $.validator.addMethod("valueNotEquals", function(value, element, arg) {
        return arg != value;
    }, "Value must not equal arg.");


    $("#myform").validate({
        rules: {
            deals_0_currency: {
                valueNotEquals: ""
            }
        },
        messages: {
            deals_0_currency: {
                valueNotEquals: "Please select an item!"
            }
        }

    });

    $('#id_deals-0-currency').on('change', function() { $('#myform').valid(); });
});
</script>
<body>
<form id="myform" method="post">
        <select id="id_deals-0-currency" class="required" name="deals_0_currency">
        <option value="">---------</option>
        <option selected="selected" value="1">USD - $</option>
        <option value="2">EUR - €&lt;/option>
        </select>
</form>​
</body>
</html>
于 2012-12-23T14:06:24.847 回答