使用jquery.validate.js插件进行条件表单验证

时间:2013-09-19 14:39:38

标签: javascript jquery jquery-validate

任何人都可以告诉我如何编写一个规则,验证用户是否选择/填充了一个单选按钮选项和(optinal)文本字段?如果未选中复选框选项#myradiogroup并且文本字段#email2为空,则规则应仅显示一条消息。

我的表单代码:

<form name="my" id="myForm" action="" method="post">

<input type="radio" name="myradiogroup" id="myradiogroup" value="option 1" /> option 1
<input type="radio" name="myradiogroup" id="myradiogroup" value="option 2" /> option 2

<label for="emailNew4use">this is an optional field:</label>
<input type="text" name="email2" id="email2" />

<input type="submit" value="send">

</form>

2 个答案:

答案 0 :(得分:4)

jQuery Validate中的required参数可以使用函数。

$('#myForm').validate({
    rules: {
        email2: {
            required: function(element) {
                if ($('[name="myradiogroup"]:checked').length) {
                    return false;
                } else {
                    return true;
                }
            }
        },
        myradiogroup: {
            required: function(element) {
                if ($('#email2').val()) {
                    return false;
                } else {
                    return true;
                }
            }
        }
    }
});

以下是Sparky

的精简版
$('#myForm').validate({
    rules: {
        email2: {
            required: function(element) {
                return !$('[name="myradiogroup"]:checked').length;
            }
        },
        myradiogroup: {
            required: function(element) {
                return !$('#email2').val();
            }
        }
    }
});

答案 1 :(得分:-2)

也许可以这样:

$('#myForm').submit(function() {
    if($('input:radio').val() == '' || $('#email2').val() == '') {
        preventDefault();
        // show error
    }
}