学习ASP.NET Core Blazor编程系列八——数据校验( 三 )

接下来我们来修改AddBook.razor组件的前端代码,将校验提示信息显示在输入框的旁边 , 在代码中添加ValidationMessage控件 , 将ValidationMessage控件的For属性与实体对象的相对应的属性相关联 。代码如下所示 。
<h3>AddBook</h3><EditForm Model=@addBook OnSubmit="Save">    <DataAnnotationsValidator />    <ValidationSummary />    <div>@Message</div>    <p> 图书名称:    <InputText @bind-Value=https://www.huyubaike.com/biancheng/addBook.Name>

作者:

出版日期:

价格:

类型:

总页数:

库存数量:

已租数量:

第十 , 在Visual Studio 2022的菜单栏上,找到“调试à开始调试”或是按F5键,Visual Studio 2022会生成BlazorAppDemo应用程序,并在浏览器中打开Home页面,我们使用鼠标点击左边的菜单栏上的“添加图书”菜单项,然后使用鼠标左键点击“保存”按钮,由于我们没有输入正确的数据,校验组件将会提示我们要输入的数据 。如下图 。
学习ASP.NET Core Blazor编程系列八——数据校验

文章插图

推荐阅读