如何自定义ASP.NET内置Input Tag Helper以修改name和id属性？

针对你想要修改Input Tag Helper默认行为的需求，这里提供三种不同场景的解决方案：

方案1：临时覆盖属性（简单场景） #

如果只是个别Input需要自定义，直接在标签上显式设置属性来覆盖默认生成内容：

<form method="post">
    <!-- 自定义name，清空id，禁用客户端验证属性 -->
    <input type="text" asp-for="Credential.Username" name="q" id="" data-val="false" placeholder="Username" autofocus />
    <input type="password" asp-for="Credential.Password" name="password" id="" data-val="false" placeholder="Password" />
    <button>Login</button>
</form>

• name="q"：直接覆盖Tag Helper生成的默认name值
• id=""：清空自动生成的id属性
• data-val="false"：关闭客户端验证，避免生成data-val-required等验证相关属性

方案2：自定义Tag Helper（全局复用） #

如果需要全局统一修改Input Tag Helper的行为，创建自定义类继承内置的InputTagHelper，重写逻辑控制属性生成：

步骤1：创建自定义Tag Helper类 #

using Microsoft.AspNetCore.Mvc.TagHelpers;
using Microsoft.AspNetCore.Razor.TagHelpers;

[HtmlTargetElement("input", Attributes = "asp-for")]
public class CustomInputTagHelper : InputTagHelper
{
    public CustomInputTagHelper(IHtmlGenerator generator) : base(generator)
    {
    }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        // 先执行内置逻辑，再修改输出结果
        base.Process(context, output);

        // 移除自动生成的id属性
        output.Attributes.RemoveAll("id");

        // 移除所有客户端验证相关属性
        output.Attributes.RemoveAll("data-val");
        output.Attributes.RemoveAll("data-val-required");
        output.Attributes.RemoveAll("data-val-regex");
        // 可根据需求继续移除其他自动生成的辅助属性

        // 若用户未自定义name，可设置默认值；已自定义则保留用户设置
        var nameAttr = output.Attributes.FirstOrDefault(a => a.Name == "name");
        if (nameAttr == null)
        {
            output.Attributes.SetAttribute("name", "");
        }
    }
}

步骤2：注册自定义Tag Helper #

在_ViewImports.cshtml中添加命名空间引用（替换为你的项目命名空间）：

@addTagHelper *, YourProjectNamespace

步骤3：View中直接使用 #

现在使用asp-for时，会自动应用自定义规则，同时支持你设置自定义name：

<form method="post">
    <input type="text" asp-for="Credential.Username" name="q" placeholder="Username" autofocus />
    <input type="password" asp-for="Credential.Password" name="password" placeholder="Password" />
    <button>Login</button>
</form>

方案3：手动绑定模型（无Tag Helper依赖） #

如果不需要Tag Helper的验证等功能，直接手动编写Input标签，在Page Model中通过Request.Form获取值：

修改Page Model #

public class LoginModel : PageModel
{
    public User Credential { get; set; } = new User();

    public async Task<IActionResult> OnPostAsync()
    {
        // 手动从表单获取自定义name对应的值
        Credential.Username = Request.Form["q"];
        Credential.Password = Request.Form["password"];

        // 手动执行模型验证逻辑
        if (string.IsNullOrEmpty(Credential.Username) || string.IsNullOrEmpty(Credential.Password))
        {
            ModelState.AddModelError(string.Empty, "用户名和密码不能为空");
            return Page();
        }
        // 可添加正则表达式等其他验证规则

        // 后续业务逻辑
        return RedirectToPage("/Index");
    }
}

View保持原代码 #

<form method="post">
    <input type="text" placeholder="Username" name="q" autofocus />
    <input type="password" placeholder="Password" name="password" />
    <button>Login</button>
</form>

注意事项 #

• 若需要保留服务器端验证，方案2中不要移除data-val相关属性，仅设置data-val="false"关闭客户端验证即可。
• 自定义Tag Helper时，可根据需求添加更多属性移除逻辑，比如aria-describedby等辅助属性。

内容的提问来源于stack exchange，提问作者lynx pravoka