jquery - 在 asp.net mvc 4 中回发时未绑定(bind)到模型的对象列表

Question

在我的 MVC 4 应用程序中，我有一个可以拥有多个站点并且可以订阅多个服务包的客户。我的 View 模型的简短版本如下所示

public class SubscriptionModel
{        
    public int MemberId { get; set; }
    public List<SitePackage> SitePackges { get; set; }
    public SubscriptionModel()
    {
        SitePackges=new List<SitePackage>();
    }
}

public class SitePackage
{
    public int SiteId { get; set; }
    public List<PackageDisplayItem> LstPackageDisplayItems { get; set; }
    public SitePackage()
    {
        LstPackageDisplayItems=new List<PackageDisplayItem>();

    }
}

public class PackageDisplayItem
{
    public int PackageId { get; set; }

    [Display(Name = "Package")]
    public string Name { get; set; }        

    [DataType(DataType.Date)]
    [Display(Name = "Start Date")]
    public DateTime? StartDate { get; set; }

}

在我的 Controller 中，我填充模型，然后传递给 View 模型进行渲染

 @using (@Html.BeginForm("CalculateCost", "HelpDesk", FormMethod.Post, new { @class = "form", id = "PackageSubscription", name = "PackageSubscription" }))
 {
 @Html.HiddenFor(x=>x.MemberId)

 <table class="table">
  @foreach (var site in Model.SitePackges)
  {
    <input name="SiteId" id="SiteId" type="hidden" value=@site.SiteId.ToString() />
           <tr><td class="col-sm-3">@site.SiteId</td></tr>
           <tr>
               <th class="col-sm-3">
                   Name
               </th>

               <th class="col-sm-2">
                   Start Date
               </th>
           </tr>
           @Html.Partial("_Packages",site.LstPackageDisplayItems)               

       }

我的部分 View 就像

@model List<PackageDisplayItem>

@for (int i = 0; i < Model.Count; i++)
{
    @Html.HiddenFor(x => x[i].PackageId)
    <tr id="@Model[i].PackageId">
        <td>
            @Html.DisplayFor(x => x[i].Name)
        </td>

        <td>
            @Html.TextBoxFor(x => x[i].StartDate, "{0:d MMM yyyy}", new { @class = "jquery_datepicker form-control", autocomplete = "off" })
        </td>
    </tr>

}

一切都渲染得很好，但在表单发布中，模型绑定(bind)程序未绑定(bind) SitePackges 列表，并且其计数始终为 0。我的 Controller 具有以下签名。

[HttpPost]
    public ActionResult CalculateCost(SubscriptionModel subscriptionModel )
    {
        var receivedModel = subscriptionModel;         
    }

不确定我设计的模型是否是处理此要求的最佳方法(要求是显示单个站点，并在其下方显示包，然后显示第二个站点和包，依此类推)。这些控件似乎生成了唯一的索引。

Jquery 帖子

function SubmitForm() {
console.log($("#PackageSubscription").serialize());
$.ajax({
    url: '/HelpDesk/CalculateCost',
    cache: false,
    dataType: 'json',
    data: $("#PackageSubscription").serialize(),
    type: 'POST',
    success: function (data) {
    }

});

}

我将不胜感激任何帮助。谢谢

Answer 1

您当前的实现正在呈现如下所示的输入:

<input ... name="[0].Name" .../>
<input ... name="[1].Name" .../>

但为了绑定(bind)到您的模型，它们需要如下所示:

<input ... name="SitePackges[0].LstPackageDisplayItems[0].Name" .../>
<input ... name="SitePackges[0].LstPackageDisplayItems[1].Name" .../>
<input ... name="SitePackges[1].LstPackageDisplayItems[0].Name" .../>
<input ... name="SitePackges[1].LstPackageDisplayItems[1].Name" .../>

A:您需要在嵌套for循环中呈现控件

for(int i = 0; i < Model.SitePackges.Count; i++)
{
  @Html.HiddenFor(m => m.SitePackges[i].SiteId)
  for(int j = 0; j < Model.SitePackges[i].LstPackageDisplayItems.Count; j++)
  {
    @Html.TextBoxFor(m => m.SitePackges[i].LstPackageDisplayItems[j].Name)
  }
}

B:或为您的模型类型使用自定义EditorTemplates

View /共享/EditorTemplates/SitePackage.cshtml

@model SitePackage
@Html.HiddenFor(m => m.SiteId)
@Html.EditorFor(m => m.LstPackageDisplayItems)

View /共享/EditorTemplates/PackageDisplayItem.cshtml

@model PackageDisplayItem
@Html.TextBoxFor(m => m.Name)

在主视图中

@model SubscriptionModel
@using (@Html.BeginForm())
{
  @Html.HiddenFor(m => m.MemberId)
  @Html.EditorFor(m => m.SitePackges)
  <input type="submit" />
}