2014-11-06 157 views
0

假設我有一個模型DailyTasks和一個模型任務。使用DailyTasks模型強制輸入初始視圖。它顯示當天現有任務的列表。用戶可以通過單擊添加按鈕將更多任務添加到列表/表格中。點擊添加按鈕時,我呈現與任務模型綁定的局部視圖。將部分視圖數據傳遞給控制器​​

我希望能夠保存用戶對現有任務所做的任何更改以及新添加的任務。

我不確定什麼是最好的方法來做到這一點。我一直在玩模型綁定,以及創建模型的json對象,然後在保存時將其傳遞給控制器​​。到目前爲止,我只能將現有任務傳回到Save控制器,沒有任何新添加的任務顯示出來。

型號:

public class DailyTasks 
{ 
    public int ID { get; set; } 
    public List<Task> TaskList{ get; set; } 
} 

public class Task 
{ 
    public int Id { get; set; } 
    public string MyTask { get; set; } 
} 

主視圖:

@model Example.Models.DailyTasks 

@using (Ajax.BeginForm("Save", "DailyTasks", new AjaxOptions { HttpMethod = "Post" })) 
{ 
<input type="button" value="Add New Task" id="addBtn" /> 
<input type="submit" value="Save" id="saveBtn"/> 

<table class="table"> 
    <tr> 
     <th>Column Header Name Goes Here</th> 
     <th>Column Header Name Goes Here</th> 
    </tr> 

    @for (var i = 0; i < Model.TaskList.Count(); i++) 
    { 
    <tr> 
     <td> 
      @Html.DisplayFor(m => Model.TaskList[i].ID) 
      @Html.HiddenFor(m => Model.TaskList[i].ID) 
     </td> 
     <td> 
      @Html.DisplayFor(m => Model.TaskList[i].MyTask) 
      @Html.HiddenFor(m => Model.TaskList[i].MyTask) 
     </td> 
    </tr> 
    } 
</table> 
} 

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#addBtn").on("click", function() { 
     $.get('@Url.Action("AddTask")', function (data) { 
      $("table tbody").append(data); 
     }); 
    }); 
}); 
</script> 

添加新的任務AcitionResult的局部視圖:

public ActionResult AddTask() 
    { 
     Task model = new Task(); 
     return PartialView("_AddTask", model); 
    } 

局部視圖(_AddTask):

@model Example.Models.Task 

    <tr> 
     <td> 
      @Html.DisplayFor(m => Model.ID) 
      @Html.HiddenFor(m => Model.ID) 
     </td> 
     <td> 
      @Html.DisplayFor(m => Model.MyTask) 
      @Html.HiddenFor(m => Model.MyTask) 
     </td> 
    </tr> 
+0

你能提供你的控制器/視圖的代碼嗎?它很難僅基於模型制定「最佳方式」建議。 – wahwahwah 2014-11-07 07:08:28

+0

看看這個鏈接http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/,尤其是非順序索引的一部分。 – Tobias 2014-11-07 07:50:33

+0

我已經提供了代碼。對不起,它有點冗長。這個概念很簡單。我只是試圖通過渲染一個局部視圖並將其添加到主視圖上的表中來將新項添加到列表中。我在這裏掙扎的唯一問題是,在提交時,它只發送原始任務列表,並且沒有任何新添加的任務(又稱局部視圖項目)被回發。我檢查鉻調試工具,以確保它正確地附加,它在那裏。讓我知道你是否需要調試工具的屏幕截圖。提前感謝您對這些人的看法。 – NKD 2014-11-07 16:09:17

回答