如何在 .NET Core 2.0 中显示数据注释错误消息?验证消息未显示

How can I show data annotation error messages in .NET Core 2.0? Validation messages are not showing

我正在使用 .NET Core 2.0 编写应用程序。我想用数据注释控制输入元素。

在模型方面,我使用了数据注释,在 UI 方面,我使用了 asp-validation-for 标签助手。代码如下。

模型中class;

namespace ExampleApp
{
    public class UserViewModel
    {
        [Required(ErrorMessage="Please fill this field"),
            Display(Name="Your Name:")]
            public string Firstname { get; set; }

        [Required(ErrorMessage = "Please fill this field")]
        public string Lastname { get; set; }
        }
    }

在文件中 UserAdd.cshtml:

@model UserViewModel
<div class="form-group">
   <label class="control-label mb-10">First name</label>
   <input asp-for="@Model.Firstname" class="form-control">
   <span asp-validation-for="@Model.Firstname" class="text-danger">
   </span>
</div>

<div class="form-group">
   <label class="control-label mb-10">Soyadı</label>
   <input asp-for="@Model.Lastname" class="form-control">
   <span asp-validation-for="@Model.Lastname" class="text-danger">
   </span>
</div>

Startup.cs 文件中的配置方法;

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
    }
    else
    {
        app.UseExceptionHandler("/Home/Error");
    }

    app.UseStaticFiles();
    app.UseCookiePolicy();

    app.UseMvc(routes =>
    {
        routes.MapRoute(
            name: "default",
            template: "{controller=Home}/{action=Index}/{id?}");
    });
}

在我的控制器端;

当我点击带有空输入值的提交按钮时,模型的 Isvalid 值等于 false。但是 UI 页面上没有任何错误消息。

为什么 UI 中没有显示错误消息,我的错在哪里?

确保您的 Shared 文件夹中有 _ValidationScriptsPartial.cshtml。此文件包含部分视图形式的验证脚本。默认情况下,此文件包含以下代码:

<environment include="Development">
    <script src="~/lib/jquery-validation/dist/jquery.validate.js"></script>
    <script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js"></script>
</environment>
<environment exclude="Development">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"
            asp-fallback-src="~/lib/jquery-validation/dist/jquery.validate.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator"
            crossorigin="anonymous"
            integrity="sha256-F6h55Qw6sweK+t7SiOJX+2bpSAa3b/fnlrVCJvmEj1A=">
    </script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js"
            asp-fallback-src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"
            asp-fallback-test="window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive"
            crossorigin="anonymous"
            integrity="sha256-9GycpJnliUjJDVDqP0UEu/bsm9U+3dnQUH8+3W10vkY=">
    </script>
</environment>

现在,如果必须在任何视图中使用此验证脚本,则可以使用 RenderPartailAsync 方法完成,如下所示(在您的情况下,在底部添加代码您的 UserAdd.cshtml 文件):

@section Scripts {
  @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

可能是您将 validatevalidate.unobtrusive jQuery 放在了错误的位置,或者它可能是您缺少 form 标签。所以请将此 jQuery 代码放在 HTML 页面的 head 部分,并确保没有任何其他 jQuery 会在它之前并使用我的设计代码。

jQuery 验证插件

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.17.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js"></script>

.cshtml 代码

<form asp-action="YourActionName">
    <div class="form-group">
        <label asp-for="Firstname" class="control-label"></label>
        <input asp-for="Firstname" class="form-control" />
        <span asp-validation-for="Firstname" class="text-danger"></span>
    </div>
 <button type="submit" >Submit</button>
</form>