如何为ASP.NET Core MVC必填控件添加验证提示信息

方法一：HTML5原生自定义验证提示 #

直接在TextAreaFor的HTML属性中添加事件，指定自定义提示文本，实现客户端即时提示：

<div class="col-xs-12">
    @Html.TextAreaFor(m => Model.StudentName, new { 
        @class = "form-control", 
        required = "required",
        oninvalid = "this.setCustomValidity('请填写必填字段')",
        oninput = "this.setCustomValidity('')"
    })
</div>

• oninvalid：控件验证失败时触发，设置自定义错误提示
• oninput：用户输入内容时清空提示，避免后续输入仍显示错误状态

方法二：ASP.NET Core MVC 模型验证（推荐） #

这种方式支持客户端+服务器端双重验证，避免用户绕过客户端验证提交无效数据：

步骤1：给模型属性添加验证特性 #

在你的模型类中，为StudentName属性标记[Required]特性并指定错误消息：

public class StudentModel
{
    [Required(ErrorMessage = "请填写学生姓名")]
    public string StudentName { get; set; }
}

步骤2：在视图中添加验证消息显示 #

在输入控件下方添加ValidationMessageFor辅助方法，用来渲染验证错误提示：

<div class="col-xs-12">
    @Html.TextAreaFor(m => Model.StudentName, new { @class = "form-control" })
    @Html.ValidationMessageFor(m => Model.StudentName, "", new { @class = "text-danger" })
</div>

步骤3：确保启用客户端验证 #

在布局文件（如_Layout.cshtml）中，确认已引入验证相关脚本（默认模板已包含，自定义布局需手动添加）：

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="~/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js"></script>

设置完成后，客户端会自动触发验证并显示自定义提示，服务器端也会对提交的数据进行二次校验。

内容的提问来源于stack exchange，提问作者Balanjaneyulu K