1

我想知道针对放置在 ViewModel 字段上的属性处理客户端、javascript 或 jQuery 驱动的 MVC4 字段验证的最佳方法是什么。

这是示例

    [Required]
     public string Username { get; set; }

     [Required]
     public string Email { get; set; }

    <div>
        @Html.LabelFor(m=>m.Username)
        @Html.ValidationMessageFor(m => m.Username)
    </div>

    <div>
        @Html.LabelFor(m=>m.Email)
        @Html.ValidationMessageFor(m => m.Email)
    </div>

目前,如果我在表单中输入无效的电子邮件地址、空的用户名等并点击提交,我会正确收到错误通知。它按预期工作

我希望每次当用户从文本框和按键失去焦点时,都必须对该字段进行验证。

我通过将其添加到每个页面来解决此问题..

<script>
    $("input").blur(function () {
        $(this).valid();
    });
    $("input").keydown(function () {
        $(this).valid();
    });
</script>

编写硬编码的 jQuery 片段并不是最好的选择。我想要一种数据驱动的方法,可能嵌入在 MVC4 中,或者是否有一种方法可以配置 jquery.validate.unobtrusive 来执行此验证。

等待回复,

谢谢-阿图尔

4

1 回答 1

1

尝试在您的页面上放置 jquery.validate 和 jquery.validate.unobtrusive 脚本

<script src="@Url.Content("~/Scripts/jquery-1.6.1.min.js")" 
type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.js")" 
type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" 
type="text/javascript"></script>

并打电话

@{Html.EnableClientValidation();}
@{Html.EnableUnobtrusiveJavaScript();}

或在 web.config 中设置下一个设置:

<appSettings>
  <add key="ClientValidationEnabled" value="true"/>
  <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
</appSettings>

在此处查看更多信息:ASP.NET MVC 3 中的非侵入式客户端验证

编辑:

jQuery 验证在第一次提交表单后发挥作用,看看 onfocusout 和 onkeyup 的源代码:

onfocusout: function( element, event ) {
            if ( !this.checkable(element) && (element.name in this.submitted || !this.optional(element)) ) {
                this.element(element);
            }
        },
onkeyup: function( element, event ) {
            if ( event.which === 9 && this.elementValue(element) === "" ) {
                return;
            } else if ( element.name in this.submitted || element === this.lastElement ) {
                this.element(element);
            }
        },

如果您需要强制对 blur 和 keydown 进行验证,您可以尝试覆盖这些函数的默认定义。尝试使用验证器对象(它是验证的所有元数据,使我们能够在页面周期的任何时候访问验证选项)。下面的代码演示了它:

<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
<script type="text/javascript">
    $(function () {
        //this function will be called after validation has triggered
        function isValid(element) {
            this.element(element);
        }
        //get current form validator (here could be other selector that corresponds to your form)
        var validator = $('form').data('validator');
        validator.settings.onfocusout = isValid;
        validator.settings.onkeyup = isValid;
    });
</script>
于 2013-06-26T21:38:07.200 回答