ASP.NET Core局部视图表单提交后Employee模型值返回空问题

问题原因 #

你用元组作为视图模型，表单里asp-for="e.Name"生成的HTML字段name属性是e.Name，但Post控制器的参数是Employee employee，模型绑定器默认会寻找不带前缀的Name字段，无法匹配e.Name，所以接收的employee为null。

解决方案 #

方案1：使用强类型ViewModel（推荐） #

创建专门的视图模型类替代元组，提升代码可维护性：

1. 定义ViewModel类

public class CreateEmployeeViewModel
{
    public List<Department> Departments { get; set; }
    public List<Title> Titles { get; set; }
    public Employee Employee { get; set; }
}

2. 修改Get请求控制器方法

public IActionResult CreateEmployee()
{
    using var context = new HR_ManagementContext();
    var viewModel = new CreateEmployeeViewModel
    {
        Departments = context.Departments.ToList(),
        Titles = context.Titles.ToList(),
        Employee = new Employee()
    };
    return View(viewModel);
}

3. 更新局部视图

@model CreateEmployeeViewModel

<form class="g-3" asp-action="CreateEmployee" asp-controller="Employees" method="post">
    <div class="row">
        <div class="col-lg-6">
            <div class="mb-3">
                <label for="Name" class="form-label">İsim</label>
                <input asp-for="Employee.Name" type="text" class="form-control" id="Name">
                <div class="invalid-feedback">
                    İsim alanı boş bırakılamaz.
                </div>
            </div>
        </div>
        <!-- 添加部门下拉框示例 -->
        <div class="col-lg-6">
            <div class="mb-3">
                <label asp-for="Employee.DepartmentId" class="form-label">Departman</label>
                <select asp-for="Employee.DepartmentId" 
                        asp-items="@(new SelectList(Model.Departments, "Id", "Name"))" 
                        class="form-control"></select>
            </div>
        </div>
        <!-- 添加职位下拉框示例 -->
        <div class="col-lg-6">
            <div class="mb-3">
                <label asp-for="Employee.TitleId" class="form-label">Unvan</label>
                <select asp-for="Employee.TitleId" 
                        asp-items="@(new SelectList(Model.Titles, "Id", "Name"))" 
                        class="form-control"></select>
            </div>
        </div>
    </div>
    <button type="submit">Tek Form</button>
</form>

4. 修改Post请求控制器方法

[HttpPost]
public IActionResult CreateEmployee(CreateEmployeeViewModel viewModel)
{
    if (ModelState.IsValid)
    {
        using var context = new HR_ManagementContext();
        context.Employees.Add(viewModel.Employee);
        context.SaveChanges();
        return RedirectToAction("Index");
    }
    // 验证失败返回原页面，重新加载下拉框数据
    viewModel.Departments = context.Departments.ToList();
    viewModel.Titles = context.Titles.ToList();
    return View(viewModel);
}

方案2：使用Bind特性（快速修复） #

如果不想创建ViewModel，可在Post方法参数上添加[Bind(Prefix = "e")]特性，让模型绑定器忽略字段前缀"e"：

[HttpPost]
public IActionResult CreateEmployee([Bind(Prefix = "e")] Employee employee)
{
    if (ModelState.IsValid)
    {
        using var context = new HR_ManagementContext();
        context.Employees.Add(employee);
        context.SaveChanges();
        return RedirectToAction("Index");
    }
    // 验证失败返回原页面，重新加载下拉框数据
    var departments = context.Departments.ToList();
    var titles = context.Titles.ToList();
    var models = (departments, titles, employee);
    return View(models);
}

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