MVC 5：如何将父视图客户ID传入分部视图并关联保存调查记录

我刚上手MVC Code First的时候也踩过类似的关联坑，结合你描述的视图结构，给你一套落地的解决方案：

1. 先把Code First实体关联搞扎实 #

首先得确保Customer和Survey的实体关系配置正确，这是后续所有操作的基础：

// Customer实体
public class Customer
{
    public int CustomerId { get; set; }
    public string CustomerName { get; set; }
    // 其他客户属性（比如联系方式、地址等）
    // 1对多导航属性：一个客户对应多个调查
    public ICollection<Survey> Surveys { get; set; } = new List<Survey>();
}

// Survey实体
public class Survey
{
    public int SurveyId { get; set; }
    public string SurveyTitle { get; set; }
    public DateTime CreateTime { get; set; } = DateTime.Now;
    // 其他调查属性（比如内容、状态等）
    // 外键：关联客户ID
    public int CustomerId { get; set; }
    // 导航属性：关联到对应的客户
    [ForeignKey("CustomerId")]
    public Customer Customer { get; set; }
}

在你的DbContext里，可以不用额外配置Fluent API（上面用DataAnnotations已经够了），但如果要更清晰也可以加：

protected override void OnModelCreating(DbModelBuilder modelBuilder)
{
    modelBuilder.Entity<Survey>()
        .HasRequired(s => s.Customer)
        .WithMany(c => c.Surveys)
        .HasForeignKey(s => s.CustomerId);
}

2. 控制器层处理ID传递与数据填充 #

接下来是控制器的Action，要负责接收客户ID、预填充调查数据，以及处理提交：

客户详情页Action（加载客户和关联的调查） #

public ActionResult Details(int id)
{
    // 用Include加载关联的调查列表，避免懒加载导致的额外查询
    var customer = _context.Customers
        .Include(c => c.Surveys)
        .FirstOrDefault(c => c.CustomerId == id);
    
    if (customer == null)
    {
        return HttpNotFound();
    }
    return View(customer);
}

新建调查的GET Action（返回模态框分部视图） #

这个Action接收客户ID，提前把Survey的CustomerID赋值，还可以把客户姓名带过去用于显示：

public ActionResult CreateSurvey(int customerId)
{
    var customer = _context.Customers.Find(customerId);
    if (customer == null)
    {
        return HttpNotFound();
    }
    
    // 预构造Survey对象，自动填充CustomerID
    var survey = new Survey
    {
        CustomerId = customerId
        // 如果Survey实体里有CustomerName字段，也可以在这里赋值：
        // CustomerName = customer.CustomerName
    };
    
    // 返回模态框的分部视图
    return PartialView("_CreateSurveyModal", survey);
}

新建调查的POST Action（处理提交） #

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult CreateSurvey(Survey survey)
{
    if (ModelState.IsValid)
    {
        _context.Surveys.Add(survey);
        _context.SaveChanges();
        
        // 提交成功后，返回更新后的调查列表分部视图，用于刷新页面
        var customer = _context.Customers
            .Include(c => c.Surveys)
            .FirstOrDefault(c => c.CustomerId == survey.CustomerId);
        return PartialView("_SurveyList", customer.Surveys);
    }
    
    // 如果验证失败，返回模态框视图，保留用户输入和错误信息
    // 这里要重新加载Customer对象，确保视图里能显示客户姓名
    survey.Customer = _context.Customers.Find(survey.CustomerId);
    return PartialView("_CreateSurveyModal", survey);
}

3. 视图层联动模态框与数据传递 #

在客户详情页（Details.cshtml）里，处理调查标签页的新建按钮，以及模态框的加载：

<!-- 调查标签页内容 -->
<div class="tab-pane fade" id="surveysTab" role="tabpanel">
    <!-- 新建调查按钮，用data属性存储当前客户ID -->
    <button id="btnCreateSurvey" data-customer-id="@Model.CustomerId" class="btn btn-primary mb-3">
        新建调查
    </button>
    
    <!-- 调查列表容器，用于后续刷新 -->
    <div id="surveyListContainer">
        @Html.Partial("_SurveyList", Model.Surveys)
    </div>
</div>

<!-- 模态框容器 -->
<div class="modal fade" id="surveyModal" tabindex="-1" role="dialog" aria-labelledby="surveyModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content" id="modalContent">
            <!-- 动态加载的分部视图会插入到这里 -->
        </div>
    </div>
</div>

<script>
$(document).ready(function() {
    // 点击新建按钮加载模态框
    $("#btnCreateSurvey").click(function() {
        var customerId = $(this).data("customer-id");
        // 用Ajax请求加载新建调查的分部视图
        $.get("@Url.Action("CreateSurvey", "YourControllerName")", { customerId: customerId }, function(data) {
            $("#modalContent").html(data);
            $("#surveyModal").modal("show");
        });
    });
    
    // 处理模态框表单的Ajax提交（避免页面刷新）
    $(document).on("submit", "#formCreateSurvey", function(e) {
        e.preventDefault();
        var formData = $(this).serialize();
        
        $.post("@Url.Action("CreateSurvey", "YourControllerName")", formData, function(data) {
            if (data) {
                // 提交成功，刷新调查列表并关闭模态框
                $("#surveyListContainer").html(data);
                $("#surveyModal").modal("hide");
            } else {
                // 验证失败，更新模态框内容显示错误
                $("#modalContent").html(data);
            }
        });
    });
});
</script>

4. 模态框分部视图的细节处理 #

新建_CreateSurveyModal.cshtml分部视图，这里要确保CustomerID通过隐藏字段传递，同时显示只读的客户姓名：

@model YourNamespace.Survey

@using (Html.BeginForm("CreateSurvey", "YourControllerName", FormMethod.Post, new { id = "formCreateSurvey" }))
{
    @Html.AntiForgeryToken()
    
    <!-- 隐藏字段：关键！确保提交时CustomerID不会丢失 -->
    @Html.HiddenFor(m => m.CustomerId)
    
    <div class="modal-header">
        <h5 class="modal-title" id="surveyModalLabel">新建调查 - 客户：@Model.Customer.CustomerName</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>
    <div class="modal-body">
        <div class="form-group">
            @Html.LabelFor(m => m.SurveyTitle, "调查标题")
            @Html.TextBoxFor(m => m.SurveyTitle, new { @class = "form-control" })
            @Html.ValidationMessageFor(m => m.SurveyTitle, "", new { @class = "text-danger" })
        </div>
        
        <!-- 显示只读的客户姓名，让用户明确是给哪个客户创建调查 -->
        <div class="form-group">
            <label>关联客户</label>
            <input type="text" class="form-control" value="@Model.Customer.CustomerName" readonly />
        </div>
        
        <!-- 其他调查字段的表单控件，根据你的需求添加 -->
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
        <button type="submit" class="btn btn-primary">保存调查</button>
    </div>
}

关键注意点 #

• 隐藏字段的使用：一定要用HiddenFor把CustomerID存在表单里，不然提交时会丢失这个关键关联ID。
• 预加载导航属性：在查询客户时用Include加载Surveys，避免懒加载导致的N+1查询问题。
• Ajax提交的好处：用Ajax提交表单可以不用刷新整个页面，提升用户体验，同时直接刷新调查列表。

这样就能完美实现你要的功能：点击客户详情页的新建调查按钮，自动传递当前客户ID，关联调查并显示客户姓名，提交后自动更新调查列表。

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