在C#ASP.NET Core 2.2中在客户端实现简单验证

问题描述 投票:0回答:1

在C#ASP.NET Core 2.2中在客户端添加简单验证

我读过MS docs on validation并认为它最适合应用客户端验证。但是,在提供的示例中,它们显示了jQuery的一些内容,我认为jQuery现在变得有点老了。此外,我们被MS的漂亮工具所破坏,它们将自动为我们做点什么。 (我认为带有属性asp-validation-for的span和带有属性asp-validation-summary的div意味着魔法就在那里。事实并非如此。)

我的代码如下所示。

<div class="row">
  <div class="col-md-4">
    <form asp-controller="Security"
          asp-action="Register"
          method="post">
      <div asp-validation-summary="ModelOnly" class="text-danger"></div>
      <div class="form-group">
        <label asp-for="@Model.Email" class="control-label"></label>
        <input asp-for="@Model.Email" class="form-control" />
        <span asp-validation-for="@Model.Email" class="text-danger"></span>
      </div>
      <div class="form-group">
        <label asp-for="@Model.Info" class="control-label"></label>
        <input asp-for="@Model.Info" class="form-control" />
        <span asp-validation-for="@Model.Info" class="text-danger"></span>
      </div>
      <div class="form-group">
        <input type="submit" value="Send" class="btn btn-primary" />
      </div>
    </form>
  </div>
</div>

我想知道我缺少什么来使验证工作正常(即如果在提交表单时没有填写两个字段以及提交表单被取消,则会收到错误消息)。或者,它是相当基本的我缺少的东西,我想得到适当的搜索词的提示。请注意,我只是在寻找视觉效果:客户端消息,与输入的后端处理程序无关。

我已经看过some questions这个主题,但由于那些似乎没有得到批准的决议,我觉得最好是以正确的方式而不是猜谜游戏来做事。

c# validation asp.net-core client-side asp.net-core-2.2
1个回答
0
投票

您需要添加对验证文件的引用。检查您的Views / 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://ajax.aspnetcdn.com/ajax/jquery.validate/1.17.0/jquery.validate.min.js"
        asp-fallback-src="~/Identity/lib/jquery-validation/dist/jquery.validate.min.js"
        asp-fallback-test="window.jQuery && window.jQuery.validator"
        crossorigin="anonymous"
        integrity="sha384-rZfj/ogBloos6wzLGpPkkOr/gpkBNLZ6b6yLy4o+ok+t/SAKlL5mvXLr0OXNi1Hp">
</script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validation.unobtrusive/3.2.9/jquery.validate.unobtrusive.min.js"
        asp-fallback-src="~/Identity/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"
        asp-fallback-test="window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive"
        crossorigin="anonymous"
        integrity="sha384-ifv0TYDWxBHzvAk2Z0n8R434FL1Rlv/Av18DXE43N/1rvHyOG4izKst0f2iSLdds">
</script>
</environment>

在视图中添加以下代码,

@section Scripts {
    <partial name="_ValidationScriptsPartial" />
}
© www.soinside.com 2019 - 2024. All rights reserved.