MVC 5 在键入时显示错误消息输入字段

本文关键字:错误 消息 输入 字段 显示 MVC | 更新日期: 2023-09-27 18:36:03

这是我当前模型的一部分:

[Required(ErrorMessage = "First name is required!")]
public string FirstName { get; set; }
[Required(ErrorMessage = "Email name is required!")]
[EmailAddress(ErrorMessage = "Invalid email address!")]
public string Email { get; set; }

是否可以在键入时显示错误消息,而不是在输入发生"失焦"时显示错误消息?视图是自动生成的。

更新这段代码由@vendettamit提供。它正在工作 50%。问题是我有更多的错误Meesages,它们都弹出了。

$(document).ready(function () {
    var settngs = $('form').data('validator').settings;
    settngs.onkeyup = function () {
        $('form').valid();
    };
    settngs.onfocusout = false;
});

MVC 5 在键入时显示错误消息输入字段

获取不显眼的 jquery 验证的验证器对象。更改应触发验证的事件。

    $(document).ready(function () {
        var $validatr = $('form').data('validator');
        var settngs = $validatr.settings;
        settngs.onkeyup = function (element, eventType) {
            if (!$validatr.element(element))
            {
                $(this.currentForm).triggerHandler("invalid-form", [this]);
            }
        };
        settngs.onfocusout = false;
    });

更新 -

  1. 似乎您必须手动触发onkeyup的验证。更新了代码段。

  2. 使用单元素验证的触发器进行了更新。

在此处查看所有验证选项以获得更多自定义。

使用 jQuery Validate 1.17 和 Unobtrusive,元素在每次击键时都已经过验证,但如果每个元素没有消息占位符,则不会显示消息。您可以使用ValidationMessageFor方法添加它:

@Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" })
<div class="col-md-10">
    @Html.TextBoxFor(m => m.Email, new { @class = "form-control" })
    @Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
</div>

请注意,在字段"提交"之前不使用密钥验证 - 例如在选项卡切换之后。