jquery 验证：从表单中删除错误消息答案

【问题标题】：jquery validation: remove error message from formjquery 验证：从表单中删除错误消息
【发布时间】：2018-04-19 22:32:44
【问题描述】：

我有一个带有电子邮件字段和“获取时事通讯”复选框的表单。

<form method="post" class="form-horizontal" action="">

<input class="form-control" type="text" id="Email" name="Email" value="test@test.com" />
<span class="text-danger field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span>

<input data-val="true" id="GetNewsletter" name="GetNewsletter" type="checkbox" value="true" />

</form>

电子邮件字段最初是可选的，但如果用户选中获取时事通讯复选框，则为必填项。我使用 jquery 验证在客户端添加了这个。

$("#GetNewsletter").change(function () {
    var checked = $(this).prop("checked");
    if (checked) {
        $('#Email').rules('add', {  //set required rule
            required: true,
            messages: {
                required: "Email is required."
            }
        });
    }
    else {
        $('#Email').rules('remove', 'required'); //remove rule and call valid()
        $('#Email').valid();
    }
});

如果未选中该复选框，我会删除规则并调用 valid() 来重置输入的状态。不幸的是，这不会删除验证消息。

是否有清除验证消息的内置方法？我想避免操纵标记，例如删除/添加验证类。

【问题讨论】：

还有其他问题。删除规则后调用 .valid() 应该会删除消息。
你可以吗？说真的，你有责任正确地证明这个问题。
演示：jsfiddle.net/zh5uofs9

标签： jquery asp.net-mvc jquery-validate unobtrusive-validation

【解决方案1】：

您的（不成功的）尝试只会删除视图中的错误消息，并且您仍然需要在控制器方法中编写代码来验证数据（客户端验证是一个不错的奖励，但它很容易被绕过，您必须在服务器上验证）。

改为使用实现IClientValidatable 的条件ValidationAttribute，以便您获得客户端和服务器端验证。此类属性的一个示例是 foolproof [RequiredIf] 或 [RequiredIfTrue] 属性，您可以将其应用于您的模型

[RequiredIfTrue("GetNewsletter", ErrorMessage = "...")]
public string Email { get; set; }

然后在视图中

@Html.TextBoxFor(m => m.Email)
@Html.ValidationMessageFor(m => m.Email)

@Html.CheckBoxFor(m => m.GetNewsletter)

如果复选框被选中，并且Email为空，则会显示一条验证消息（如果绕过客户端验证，则ModelState在POST方法中将无效。

或者，如果您想编写自己的条件验证属性，请参阅 The Complete Guide To Validation In ASP.NET MVC 3 - Part 2 以获得良好的指南。

【讨论】：

【解决方案2】：

您只能动态添加/删除使用插件方法添加的规则¹。

$('form').validate({
    rules: {
        Email: {
            required: true
        }
    }
});

演示：jsfiddle.net/zh5uofs9/

如果你有其他东西使它成为required，例如内联属性²，那么你将无法使用.rules('remove')¹。

演示 2：jsfiddle.net/zh5uofs9/1/

¹ 根据文档：

“仅操作通过规则选项或rules("add") 指定的规则。”

²由于您使用的是 ASP，您的 .validate() 实例将由 Unobtrusive Validation 插件自动构建，并且您具有声明规则的内联属性。

底线：消息不会被清除，因为规则没有被删除。并且您不能在使用内联验证属性时动态禁用或删除规则。

【讨论】：