4

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

首先,我们来举个例子。首次启动应用程序时会显示管理员的登录创建屏幕(只是不要对站点所有者说“第一次使用 admin/admin 作为登录”)。

视图模型:

public class AdministratorViewModel : AbstractViewModel
{
    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblUsername")]
    public string Username { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblEmailAddress")]
    [EmailAddress]
    public string EmailAddress { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPassword")]
    [AdminPassword]
    public string Password { get; set; }

    [Required]
    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPasswordConfirm")]
    [Compare("Password")]
    public string PasswordConfirm { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblLastLogin")]
    public DateTime? LastLogin { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblPasswordExpiry")]
    public DateTime? PasswordExpiry { get; set; }

    [Display(ResourceType = typeof(ManageAdminsViewModelResources), Name = "lblBlocked")]
    public bool Blocked { get; set; }
}

部分视图(创建第一个管理员时只需要几个字段)

@using (Html.BeginForm())
{
    @Html.ValidationSummary(false)
    @Html.AntiForgeryToken()

    <fieldset>
        <legend>@ManageAdminsViewResources.legendCreateAdmin</legend>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.Username)
            @Html.EditorFor(m => m.Username)
            @Html.ValidationMessageFor(m => m.Username)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.Password)
            @Html.PasswordFor(m => m.Password)
            @Html.ValidationMessageFor(m => m.Password)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.PasswordConfirm)
            @Html.PasswordFor(m => m.PasswordConfirm)
            @Html.ValidationMessageFor(m => m.PasswordConfirm)
        </div>

        <div class="desktoptile">
            @Html.LabelFor(m=>m.EmailAddress)
            @Html.EditorFor(m => m.EmailAddress)
            @Html.ValidationMessageFor(m => m.EmailAddress)
        </div>

        <input type="submit" value="@ManageAdminsViewResources.btnCreate"/>
    </fieldset>
}

控制器

    [AllowAnonymous]
    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult CreateFirst(AdministratorViewModel viewModel)
    {
        if (!ModelState.IsValid) return View(viewModel);
        [...................]

目前

如果我在表单中输入无效的电子邮件地址、空密码等并点击提交,我会正确地收到错误通知。好的,我们继续

我想要的是

因为我正在做一个 Metro 风格的设计,所以我希望每次用户不关注该字段的文本框验证时都会发生这种情况。

编写硬编码的 jQuery 片段并不是最好的选择。我想要一种数据驱动的方法,可能嵌入在我目前正在学习的 MVC4 中。

因此,给定具有标准自定义属性的 ViewModel(无论如何,都需要一点 Javascript,请考虑Org.Zighinetto.AdminPasswordAttribute检查密码复杂性的方法),我如何以最不显眼的方式强制执行客户端验证,而不指定客户端-每个 html 标记上的侧标记并编写尽可能少的代码?

在 ASP.NET MVC 4 验证中是否还有任何我必须取消隐藏的秘密?

4

2 回答 2

2

好吧,您必须使用 jQuery 调用 jQuery 验证(因为它是用 jQuery 编写的 :))

您可以为您的输入添加一个全局事件,然后在模糊元素上调用它。就像是:

$("input").blur(function () {
    $(this).valid();
});
于 2013-03-28T22:05:45.340 回答
2

从我(学习)的角度来看,正确的答案应该是:

解释:

当 jQuery Unobtrustive Validator 加载到页面中时,MVC4 会自动完成公共属性的验证,否则只执行服务器端验证。

大多数(如果不是全部)MVC4ValidationAttribute实现IClientValidation. 此接口将 jQuery Validator 验证函数包装在服务器端代码中。很难解释它究竟是如何工作的,但是说这个接口返回客户端函数的名称(由 jQuery 分发提供或由用户实现),虽然基本上是错误的,但至少给新手用户提供了这个想法试图理解验证如何工作。

回答:

继续使用数据驱动的模型/视图模型注释。检查页面中是否加载了NuGet包jQuery Unobtrusive Validation,然后IClientValidation根据需要实现(我在这里找到了一个关于多个错误的教程),字段自动验证。

于 2013-03-28T22:25:18.653 回答