如何使動作接受模型列表？ （ASP.NET MVC 5）

Question

我能夠成功地接受一個條目到我的數據庫。但是，其餘條目不是來自我的動態添加字段。

這裏是我創建兄弟姐妹：

[HttpPost] 
[ValidateAntiForgeryToken] 
public ActionResult Create(List<sibling> siblings) 
    { 

     if (ModelState.IsValid) 
     { 
      foreach(sibling x in siblings) 
      { 
       db.siblings.Add(x); 
       db.SaveChanges(); 
      } 
      return RedirectToAction("Index"); 
     } 
     return View(siblings); 

這裏是我的兄弟姐妹型號：

public partial class sibling 
{ 
    public int sibling_id { get; set; } 
    public int child_id { get; set; } 
    public Nullable<int> age { get; set; } 
    public string gender { get; set; } 

    public virtual child child { get; set; } 
} 

這是我Create.cshtml：

@model dummyApp.Schema.TestModels.sibling 

@{ 
ViewBag.Title = "Create"; 
} 

@section Scripts{ 
<script type="text/javascript"> 

    $(document).ready(function() { 
     //var max_fields = 10; //maximum input boxes allowed 
     var wrapper = $(".input_fields_wrap"); //Fields wrapper 
     var add_button = $(".add_field_button"); //Add button ID 

     var x = 1; //initlal text box count 
     $(add_button).on("click", function (e) { //on add input button click 
      e.preventDefault(); 
      //if (x < max_fields) { //max input box allowed 
       x++; //text box increment 
       $(wrapper).append('<div class="form-group">\ 
             <p>Child ID: <input type="number" name="siblings[' + x + '].child_id"/></p>  \ 
             <p>Age: <input type="number" name="siblings[' + x + '].age"/></p> \ 
             <p>Gender: <input type="text" name="siblings[' + x + '].gender"/></p> \ 
             <a href="#" class="remove_field">Remove</a>  \ 
            </div>'); //add input box 
      //} 
     }); 

     $(wrapper).on("click", ".remove_field", function (e) { //user click on remove text 
      e.preventDefault(); $(this).parent('div').remove(); x--; 
     }) 
    }); 

</script> 
} 
<h2>Create</h2> 

@using (Html.BeginForm()) 
{ 
@Html.AntiForgeryToken() 

<div class="form-horizontal"> 
    <h4>sibling</h4> 

    <div class="input_fields_wrap"> 
     <button class="add_field_button btn btn-info">Add More Fields</button> 
     <br><br> 
     <div class="form-group"> 
      <p>Child ID: <input type="text" name="siblings[0].child_id" /></p> 
      <p>Age: <input type="text" name="siblings[0].age" /></p> 
      <p>Gender: <input type="text" name="siblings[0].gender" /></p> 
     </div> 
    </div> 

    <div class="form-group"> 
     <br> 
     <div class="col-md-offset-0 col-md-10"> 
      <input type="submit" value="Create" class="btn btn-default" /> 
     </div> 
    </div> 

</div> 
} 

<div> 
@Html.ActionLink("Back to List", "Index") 

Answer 1

你初始值爲x爲1，並且在將它傳遞給您在javascript中創建的動態html之前，您正在執行x++;這會將元素渲染爲siblings[2].child_id。這會破壞索引的連續性，因爲aiblings [1]缺失，並且模型綁定器將在序列中斷時停止綁定。

作爲一個解決方案，

• 做HTML追加或
• 去非循序索引方法後做x++ - 有名字siblings.Index隱藏字段和一些獨特的價值分配到外地和使用這個值作爲序列。這裏更多的信息 - http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/ - >非循序索引

更新 - 它始終是更好地去與非循序索引方法，因爲提到將在情況下打破第一種方法是有刪除功能，這將inturn刪除中間的一個項目，從而破壞序列。