在jQuery中获取表单提交的实体的子实体

Question

假设我的 EF 中有两个相关的表：

public partial class Table1 
{
    public int Id {get; set;}
    public int Table2Id {get; set;}
    public virtual Table2 Table2 {get; set}
}
public partial class Table2 
{
    public Table2()
    {
        Table1 = new HashSet<Table1>
    }

    public int Id {get; set;}
    public string datastring {get; set;}
    public virtual Icollection<Table1> Table
}

我已经很明显地简化了这一点，但它与我的实际问题非常相似。

通常，如果它只是一个表，我可以轻松地从 jQuery 中提交的表单中提取数据。我会这样做：

form.serializeArray();

但是，在这种情况下，我想从我的表单中提取数据，这些数据会进入我实际表的“子”表中。

<div class="container">
    <form id="MyForm">
        <input name="Table1.Table2.dataString" />
        <button type="submit">save</button>
    </form>
</div>

我感觉 .net MVC 支持这种情况，但我不知道如何实际进行命名以使其理解它属于“子”表。

快速而肮脏的方法是针对表单中的每个输入字段。但它是一个大表格，因此我真的想避免那种疯狂的选择器。

更新：

即使我还没有制作我的控制器，我相信它应该收到一个 Table1 对象，如下所示：

public ActionResult UpdateTables(Table1 table1)
{
    //Logic to call serviceclass
}

Answer 1

在同步 POST（不是 AJAX）中，子记录应该按索引放置；

<input name="Table1.Id" value="1">

<input name="Table1.Table2[0].Id" value="1">
<input name="Table1.Table2[0].datastring" value="1A">

<input name="Table1.Table2[1].Id" value="2">
<input name="Table1.Table2[1].datastring" value="2B">

<input name="Table1.Table2[2].Id" value="3">
<input name="Table1.Table2[2].datastring" value="3C">

---

如果您要使用 AJAX 并且控制器操作接受 Table1 类型的对象；

public ActionResult UpdateTables(Table1 table1)
{
    //Logic to call serviceclass
}

然后你需要像这样格式化你的 json 对象（form.Serialize 不起作用，你需要通过循环遍历你的子实体来手动格式化它）；

{
   Id: 1,
   Table2: [
      { Id: 1, datastring: "1A" },
      { Id: 2, datastring: "2B" },
      { Id: 3, datastring: "3C" }
   ]
}

---

我建议在您的 HTML 中，为您的子实体添加一个包装器，一个带有类的 div；

<div class="child">
   <input name="Table1.Table2[0].Id" value="1">
   <input name="Table1.Table2[0].datastring" value="1A">
</div>

<div class="child">
   <input name="Table1.Table2[1].Id" value="2">
   <input name="Table1.Table2[1].datastring" value="2B">
</div>

这样您就可以遍历 child 类并填充您的 Table2 数组。

var childArray = [];

// loop through elements with child class and access the input fields and assign to an array
$(".child").each(function(){
   var id = $(this).find("input").eq(0).val();
   var datastring = $(this).find("input").eq(1).val();

   var childObject = {id:id,datastring:datastring};
   childArray.push(childObject);
});

// create your json to submit via ajax
var jsonToSubmitToController = {
   Id: $("#table1Id").val(),
   Table2: childArray
};

form.Serialize 在这里解释了不工作的 json； JSON object post using form serialize not mapping to c# object`