我正在加载一个部分视图,这取决于下拉列表选择,就像这里描述的那样:Load partial view depending on dropdown selection in 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没有得到更新。有什么选择来解决这个问题?
答案 0 :(得分: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试图将DIRECTLY绑定到名为&#34; House&#34;的属性。所以它假设你的模型有类似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>