Question

如何在单独的元素中显示所有验证错误（例如：div）而不是使用附加到每个元素的标签？

目前，我有以下代码将所有错误绑定到表单下方的另一个div元素。

$('#myForm').validate({
        rules:{
            txtName:{
                required:true,
                minlength:5,
                maxlength:100
            },
            selGroups:{
                required:true
            },
            txtDate:{
                required:true
            }
        },
        submitHandler:function () {
            return false;
        },
        messages:{
            txtHolidayName:"Please enter the Name (5 - 100 chars)",
            selGroups:"Please select the Group",
            txtHolidayDate:"Please select the date"
        },
        errorPlacement:function (error, element) {
            error.appendTo($('#errorContainer'));
        },
        invalidHandler:function (form, validator) {
            var errors = validator.numberOfInvalids();
            if (errors)
                $('#errorContainer').fadeIn();
        }
    });

我已经部分实现了这一点，但在所有验证成功后隐藏包含所有错误的div元素时遇到问题。有人可以帮我解决这个问题吗？

Answer 1

使用 errorLabelContainer 设置，该设置也适用于包装设置

$("form").validate({
errorLabelContainer: "#messageBox",
wrapper: "li",
});

确保您拥有相应的html

<ul id="messageBox"></ul>
<form>
 <input name="fname" id="fname" class="required">
 <input type="submit" />
</form>

Alternate Element显示jQuery Validation错误

1 个答案: