Question

根据接受的答案here，我必须做的是使必要的选择与验证一起工作。

我在jsfiddle上创建了一个示例，但我无法正常工作。

主要区别在于我的默认值是空的（＆＃34;＆＃34;）。

<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 - €</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!"
                }
            }

        });
    });
})

Answer 1

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

触发

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

DEMO（删除了所需的课程）http://jsfiddle.net/WGL4j/7/

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

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

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

Answer 2

首先......你没有编写有效的JavaScript。你的名字不能有破折号！切换到'_'或引用名称，它将有效。请务必通过JSLint或JSHint等工具运行JavaScript。

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

在选择值更改时检查验证方面，您需要手动调用验证。 JQuery Validation comes with the method valid to do this。更新您的就绪功能以包括此行。

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

好的，现在所有更改都已到位，最终代码应如下所示（entire working jsFiddle here）：

<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 - €</option>
        </select>
</form>
</body>
</html>

验证强制选择不起作用

2 个答案: