如何使表单提交更新的值时，它的部分视图在asp.net

Question

我正在加载一个部分视图取决于下拉列表的选择，就像它是如何描述在这里:加载部分视图取决于下拉选择在MVC3。我的代码是这样的:

视图:

@....ParentModel
@using (Html.BeginForm("Method", "Controller", FormMethod.Post))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
    <div id="info">
        <div id="info-selection">
            @Html.LabelFor(m => m.SavedInfo)
            @Html.DropDownListFor(m => m.SavedInfo , infoListItems, new { @id = "info-dropdown" })
        </div>
        <div id="info-describtion">
            @Html.EditorFor(m => m.ChildModel)
        </div>
    </div>
    <input type="submit" id="confirm_btn" value="Go!" />
}
<script>
    $('#info-dropdown').change(function () {
    var id = $(this).val();
    $.get('/Cart/SelectInfo/' + id, function (data) {
         $('#info-describtion').html(data);
         //$('#info-describtion').fadeIn('fast');
     });
     });
</script>

PartialView:

@model ...Info
@{
     List<SelectListItem> listMetroItems = new List<SelectListItem>();
     listMetroItems.Add(new SelectListItem
     {
        Text = "no metro",
        Value = "NoMetroAvailable",
        Selected = true
     });
}
<ul id="info-left">
     <li>
         @Html.LabelFor(m => m.Undegraund)
         @Html.DropDownListFor(m => m.Undegraund, listMetroItems)
     </li>
     <li>
         @Html.LabelFor(m => m.House)
         @Html.TextBoxFor(m => m.House)
     </li>
     <li>
         @Html.LabelFor(m => m.Flat)
         @Html.TextBoxFor(m => m.Flat)
     </li>
     <li>
         @Html.LabelFor(m => m.Floor)
         @Html.TextBoxFor(m => m.Floor)
     </li>
</ul>
<ul id="info-right">
      <li>
         @Html.LabelFor(m => m.Street)
         @Html.TextBoxFor(m => m.Street)
      </li>
       <li>
          @Html.LabelFor(m => m.Building)
          @Html.TextBoxFor(m => m.Building)
      </li>
      <li>
          @Html.LabelFor(m => m.Porch)
          @Html.TextBoxFor(m => m.Porch)
      </li>
      <li>
          @Html.LabelFor(m => m.IntercomCode)
          @Html.TextBoxFor(m => m.IntercomCode)
     </li>
  </ul>

控制器:

    public ActionResult SelectInfo(int id)
    {
        Info partialViewModel = new Info(id);
        return PartialView("~/Views/Shared/EditorTemplates/InfoModel.cshtml", partialViewModel);
    }

有一件事我不能正常工作:你可以看到，我加载的部分视图是表单的一部分。表单内容更新上完美的下拉更改。但是，当我单击表单的提交按钮时，它会发布过时的数据，而不是用SelectInfo()方法替换的数据!我认为这是因为当部分视图更新时，整个视图的ParentModel没有得到更新。解决这个问题有哪些选择?

Answer 1

这就是我认为正在发生的事情。首先，在选择任何下拉菜单之前，加载页面并查看源代码。注意不同输入的Name属性。比如

<input class="text-box single-line" id="Info_House" name="Info.House" type="text" value="">

注意名称。Info.House。名称驱动MVC ASP.net中的模型绑定。现在请注意，您的分部视图直接采用Info模型。不是父模型。因此，一旦你选择了一个下拉项，你的局部视图就会填充你现在有这样的输入:

<input id="House" name="House" type="text" value="House">

现在注意新名称。生成的html试图直接绑定到一个名为"House"的属性。它假设你的模型是model。house。但是你的父模型没有。它有Model.Info.House

所以你需要做的是:在你的控制器

控制器

public ActionResult SelectInfo(int id)
{
    Info info = new Info(id);
    var parentModel = new ParentModel { Info = info};
    return PartialView("~/Views/Shared/EditorTemplates/InfoModel.cshtml", parentModel);
}

现在在你的局部视图中你会有

部分视图(注意部分视图现在接受ParentModel。不是子模型。

@model MvcApplication1.Models.ParentModel
@{
    List<SelectListItem> listMetroItems = new List<SelectListItem>();
    listMetroItems.Add(new SelectListItem
    {
        Text = "no metro",
        Value = "NoMetroAvailable",
        Selected = true
    });
}
<ul id="info-left">
     <li>
         @Html.LabelFor(m => m.Info.Undergraund)
         @Html.DropDownListFor(m => m.Info.Undergraund, listMetroItems)
     </li>
     <li>
         @Html.LabelFor(m => m.Info.House)
         @Html.TextBoxFor(m => m.Info.House)
     </li>
     <li>
         @Html.LabelFor(m => m.Info.Flat)
         @Html.TextBoxFor(m => m.Info.Flat)
     </li>
     <li>
         @Html.LabelFor(m => m.Info.Floor)
         @Html.TextBoxFor(m => m.Info.Floor)
     </li>
</ul>
<ul id="info-right">
      <li>
         @Html.LabelFor(m => m.Info.Street)
         @Html.TextBoxFor(m => m.Info.Street)
      </li>
       <li>
          @Html.LabelFor(m => m.Info.Building)
          @Html.TextBoxFor(m => m.Info.Building)
      </li>
      <li>
          @Html.LabelFor(m => m.Info.Porch)
          @Html.TextBoxFor(m => m.Info.Porch)
      </li>
      <li>
          @Html.LabelFor(m => m.Info.IntercomCode)
          @Html.TextBoxFor(m => m.Info.IntercomCode)
     </li>
  </ul>