6

ユーザーがHTMLテーブルに行を動的に追加できるようにするASP.net MVC 4.0 Webアプリケーションを取得しました。

私からしてみれば:

$('.del').live('click', function () {
    id--;

    var rowCount = $('#options-table tr').length;

    if (rowCount > 2) {
         $(this).parent().parent().remove();
    }  
});

$('.add').live('click', function () {
    id++;
    var master = $(this).parents("table.dynatable");

    // Get a new row based on the prototype row
    var prot = master.find(".prototype").clone();
    prot.attr("class", "")
    prot.find(".id").attr("value", id);

    master.find("tbody").append(prot);
});

<table class="dynatable" id="options-table" width="100%" style="text-align:center" border="1">
    <tr class="prototype">
        <%:Html.EditorFor(m => Model.ChillerDetails)%> //referring to the template
    </tr>
    <thead>
</table>

私のテンプレートでは:

<%@ Control  Language="C#" Inherits="System.Web.Mvc.ViewUserControl<GMIS.Models.GMISEBModels.ChillerPlantDetails>" %>

<div id="ChillerPlantDetails">
    <td><%: Html.EditorFor(m => m.ChillerAge) %></td>
    <td><%: Html.EditorFor(m => m.ChillerBrand) %></td>
    <td><%: Html.EditorFor(m => m.ChillerCapacity) %></td>
    <td><%: Html.EditorFor(m => m.ChillerRefrigerant) %></td>
    <td>
        <a href="#" class="add"><img src="<%= Url.Content("~/Content/Images/add.png") %>"/>&nbsp;<a href="#" class="del"><img src="<%= Url.Content("~/Content/Images/remove.png") %>"/>
    </td>
</div>

私のモデルでは:

public class AddHealthCheckFormModel
{
    public List<ChillerPlantDetails> ChillerDetails { get; set; }
}

public class ChillerPlantDetails
{
    //[Required(ErrorMessage = "Please enter Chiller Capacity.")]
    [Display(Name = "Chiller Capacity")]
    public string ChillerCapacity { get; set; }

    //[Required(ErrorMessage = "Please enter Age of Chiller.")]
    [Display(Name = "Age of Chiller")]
    public string ChillerAge { get; set; }

    //[Required(ErrorMessage = "Please enter Chiller Brand.")]
    [Display(Name = "Chiller Brand")]
    public string ChillerBrand { get; set; }

    //[Required(ErrorMessage = "Please enter Chiller Refrigerant.")]
    [Display(Name = "Chiller Refrigerant")]
    public string ChillerRefrigerant { get; set; }
}

ここで、動的に追加された行のデータをコントローラーにキャプチャしてデータベースに保存するにはどうすればよいでしょうか?

4

1 に答える 1