为什么我有2个不同的必填字段验证弹出窗口

Posted 2021-05-06

我有2个不同的页面，每个页面上都有一个表单。

现在一个页面，如果我将所需的字段留空我得到这些验证弹出窗口：

这是上图的代码：

<div class="form-group">
    <p class="control-label col-md-5"><i class="fa fa-exclamation-triangle triangle" aria-hidden="true"></i> <b>Voorletter(s)</b></p>
    <div class="col-md-4">
        @html.EditorFor(model => model.Voorletters, new { htmlAttributes = new { @class = "form-control", required = "required", placeholder="K" } })
        @Html.ValidationMessageFor(model => model.Voorletters, "", new { @class = "text-danger" })
    </div>
</div>

但另一方面我得到一个弹出窗口，如果你问我有相同的代码：

<div class="form-group">
    <p class="control-label col-md-5"><i class="fa fa-exclamation-triangle triangle" aria-hidden="true"></i> <b>Functie</b></p>
    <div class="col-md-4">
         @Html.EditorFor(model => model.Functie1, new { htmlAttributes = new { @class = "form-control", required = "required" } })
         @Html.ValidationMessageFor(model => model.Functie1, "", new { @class = "text-danger" })
    </div>
</div>

但我更喜欢后一种选择，我怎么总是这样呢？

后一个验证消息是否为chrome标准？

编辑：

之前我尝试通过创建元类来更改第一个验证消息“此字段是必需的”，但这只是更改了文本。

[MetadataType(typeof(medewerkerMetaData))]
public partial class medewerker
{
    public partial class medewerkerMetaData
    {
      //[Required(ErrorMessage = "Verplicht invullen!")]
        public string Voorletters { get; set; }

      // more code
    }
 }

答案

第一个是显示来自[Required]属性的mvc客户端验证错误。第二个是显示浏览器HTML-5验证消息（因为required属性），这意味着你没有在该视图中包含jquery.validate.js和jquery.validate.unobtrusive.js脚本（或者没有正确加载广告不起作用）。

当您使用验证脚本时，它会将novalidate属性添加到您的表单中，以便忽略HTML-5验证（2不能很好地协同工作）。

尽管你可能会想到，你不希望浏览器HTML-5验证 - 它只是客户端验证（不是服务器端，这是最重要的），并且不符合你的服务器端验证属性。