如何在ASP.NET Core编辑视图(Edit.cshtml)中实现动态远程验证？

1. 为模型属性添加远程验证特性 #

修改Category模型的Name属性，添加[Remote]特性，指定验证的控制器、动作方法、请求方式，同时配置额外字段用于编辑场景排除当前记录：

public partial class Category
{
    [Key]
    [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
    [UIHint("Hidden")]
    public int Id { get; set; }

    [Required]
    [MaxLength(40, ErrorMessage = "名称不能超过40个字符")]
    [Remote("CheckNameExists", "Category", HttpMethod = "POST", 
           ErrorMessage = "该名称已存在，请输入其他名称",
           AdditionalFields = "Id")]
    public string Name { get; set; }

    public int Order { get; set; }

    [UIHint("Checkbox")]
    public bool IsActive { get; set; }
}

2. 完善动态视图的远程验证属性生成 #

在Edit.cshtml的GetValidationAttributes方法中，补充RemoteAttribute所需的URL和额外字段属性，确保客户端能正确发起验证请求：

if (property.GetCustomAttribute<Microsoft.AspNetCore.Mvc.RemoteAttribute>() is Microsoft.AspNetCore.Mvc.RemoteAttribute remote)
{
    attributes.Add("data-val='true'");
    attributes.Add($"data-val-remote='{remote.ErrorMessage ?? $"{displayName} 已被使用。"}'");
    attributes.Add($"data-val-remote-type='{remote.HttpMethod}'");
    // 生成验证请求的完整URL
    var url = new UrlHelper(HttpContext).Action(remote.Action, remote.Controller);
    attributes.Add($"data-val-remote-url='{url}'");
    // 添加额外字段（如ID，用于编辑时排除当前记录）
    if (!string.IsNullOrEmpty(remote.AdditionalFields))
    {
        attributes.Add($"data-val-remote-additionalfields='{remote.AdditionalFields}'");
    }
}

3. 在控制器中实现远程验证动作方法 #

在CategoryController中添加处理远程验证的动作，检查名称是否重复（编辑时跳过当前记录）：

[AcceptVerbs("Get", "Post")]
public IActionResult CheckNameExists(string name, int id)
{
    // 新增场景id为0，编辑场景传入当前记录ID以排除自身
    var exists = _context.Categories
        .Any(c => c.Name.Equals(name, StringComparison.OrdinalIgnoreCase) && c.Id != id);
    
    // 返回true表示验证通过（名称可用），false表示验证失败（名称已存在）
    return Json(!exists);
}

4. 确保客户端验证脚本已引入 #

在布局页或Detail.cshtml中引入jQuery验证相关依赖脚本，远程验证需要这些库支持：

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

5. 适配自定义表单提交逻辑（可选） #

如果使用了自定义的handleFormSubmit方法，确保提交前先触发客户端验证：

function handleFormSubmit(form, actionUrl) {
    // 先执行客户端验证，不通过则终止提交
    if (!$(form).valid()) {
        return false;
    }
    // 后续表单提交逻辑...
}

内容的提问来源于stack exchange，提问作者Patel Sahil