如何在Asp.net Core 2中使用jQuery获取转换的ModelState错误消息？

Question

我正在尝试使用Data Annotations ， jQuery Validation和jQuery Unobtrusive验证来验证Asp.net Core 2.0应用程序中的HTML表单，正如文档强烈建议的那样。 我也有一些自定义Javascript，可在通知窗口中显示错误消息。

我有一个看起来像这样的模型：

class Model
{
    [Required(ErrorMessage = "Required")]
    [Display(Name = "Email")]
    [EmailAddress(ErrorMessage = "ValidEmail")]
    public string Email { get; set; }
}

经过多次尝试，我让Asp.net发出一个input标签，准备好进行适当的本地化错误消息验证：

<input class="form-control input-validation-error" type="email" 
  data-val="true" data-val-email="L'adresse e-mail est invalide."
  data-val-required="Le champ E-mail est obligatoire." id="Email" 
  name="Email" value="test@example" aria-describedby="Email-error">

在提交表单之前 ，我设法使验证工作在客户端。 jQuery Validation正确地检测到一个空字段，我可以使用Javascript显示来自data-val-required的消息。 为了完整起见，我有类似以下内容来处理消息：

function onFormValidationFailed(e, args: JQueryValidation.Validator) {
    ErrorManager.clearErrors();

    for (var error in args.errorList) {
        ErrorManager.addError(args.errorList[error].message);
    }
}

$("form")
    .on("invalid-form.validate", onFormValidationFailed);

但是，客户端验证会接受诸如test@example类的值，因此将提交表单。 然后，Asp.net模型验证会捕获该错误。 在我的操作中，我可以看到this.ModelState.IsValid确实为false并且如您在上面看到的那样，该字段已正确标识为类input-validation-error 。

我的问题是我无法弄清楚如何获得相关的错误消息来显示它。

页面加载时，我试图调用$("form").validate()来尝试触发验证，但是我没有收到任何错误消息。 （或者至少没有触发invalid-form.validate事件。）

作为后备解决方案，我尝试使用<div asp-validation-summary="All"></div>使Asp.net在我可以使用Javascript获得错误消息的地方注入错误消息。 但这很快就变成了死胡同，因为消息尚未本地化！

<div class="validation-summary-errors" data-valmsg-summary="true">
    <ul>
        <li>ValidEmail</li>
    </ul>
</div>

事实上，我检查了服务器端和ModelState集合不包含本地化的消息。

谁能帮助我找到一个解决方案，当从服务器返回无效的模型状态时，我可以通过Javascript获得相关的本地化数据注释错误消息，以便向用户显示这些错误消息？ （或提出更好的做法？）

Answer 1

我找到了解决我问题的方法，尽管有些尴尬，但我在这里分享了它，以防其他人遇到类似情况。

实际问题

事实证明，我正在使用的代码与上面描述的不完全相同，但是直到我尝试创建精简的版本进行重现之前，我才注意到这一点。

该模型看起来像这样：

class Model : ModelData
{
}

class ModelData
{
    [Required(ErrorMessage = "Required")]
    [Display(Name = "Email")]
    [EmailAddress(ErrorMessage = "ValidEmail")]
    public string Email { get; set; }
}

该视图具有如下代码：

@model MyApp.Model

<input asp-for="Email" />

控制器有两种这样的方法：

[HttpGet]
public IActionResult Edit()
{
    return View(new Model());
}

[HttpPost]
public IActionResult Edit(ModelData data)
{
    if (ModelState.IsValid)
    {
        data = _service.Save(data);
    }

    var model = new Model
    {
        Email = data.Email
    };

    return View(model);
}

我的resx文件称为Model.resx 。

根本原因

我错过的是模型中的继承！

一旦我注意到，一切都变得有意义：

• 构建视图时， Model类型的Model在Model.resx找到了翻译
• 但是，在操作中进行验证时，验证的类型不是ModelData ，并且资源管理器无法找到该类型的转换，因为没有ModelData.resx

解决方法

为了解决我的问题，我更喜欢使用组合而不是继承 。 我的模型现在看起来像这样：

class Model
{
    public ModelData Data { get; set; }
}

这样的视图：

@model MyApp.Model

<input asp-for="Data.Email" />

并将所有相关翻译移至ModelData.resx 。 由于ModelData是我正在为input构建的类型， 并在控制器操作中进行验证，因此资源始终会正确处理。