我是MVC的新手,我在部分视图方面遇到了很多麻烦。希望有人可以给我一些指导。
我们正在尝试将我们的ASP.Net webforms应用程序移植到MVC。我创建了一个小测试应用程序,试图模仿我们在许多页面上做的事情。基于我找到here的示例代码,我有一个View和Partial视图以及一个包含Partial模型的Model。该视图有一个下拉列表,用于隐藏/显示部分视图。
当用户选择隐藏时,我有一个隐藏局部视图的javascript方法。如果他们选择Visible,则javascript会调用一个操作,我希望能够修改模型并将其发送回视图。我还需要能够在页面上隐藏或显示其他部分视图。在另一种情况下,我需要能够在javascript函数本身内修改TestModel和PartialModel并重新渲染(将更改反映给用户)。
我目前有两件事我无法弄清楚:
现在,代码调用我创建新PartialModel并将其传递回视图的操作。这有效但当我点击保存按钮时," old" PartialModel传递给HTTPPost操作。但是,我需要修改现有模型而不是创建新模型。
我已经发布了以下代码。任何帮助将不胜感激。
控制器
namespace WebApplication1.Controllers
{
public class TestController : Controller
{
// GET: Test
public ActionResult Index()
{
TestModel tm = new TestModel();
tm.Vis = Visibility.Visible;
return View(tm);
}
[HttpPost]
public ActionResult Index(TestModel tm)
{
return View(tm);
}
public ActionResult DDLChangedAction(int id)
{
// I need access to TestModel including TestModel.PartialModel
var pvm = new PartialModel();
pvm.PartialInt = 100;
pvm.PartialString = id.ToString(); ;
pvm.PartialString2 = "asdf";
////return PartialView("_PartialTest", pvm,
//// new ViewDataDictionary(System.Web.Mvc.Html.HtmlHelper.ViewData)
//// {
//// TemplateInfo = new TemplateInfo { HtmlFieldPrefix = HtmlHelper.NameFor(m => m.Partial).ToString() }
//// });
return PartialView("_PartialTest", pvm);
}
private ActionResult PartialView(string v, PartialModel pvm, ViewDataDictionary viewDataDictionary)
{
throw new NotImplementedException();
}
}
}
模型
namespace WebApplication1.Models
{
public class TestModel
{
public TestModel()
{
Partial = new PartialModel();
Partial.PartialInt = 42;
Partial.PartialString = "partialString text";
Partial.PartialString2 = "partialString2 text";
}
public int SelectedItem { get; set; }
public Visibility Vis { get; set; }
public PartialModel Partial { get; set; }
}
public class PartialModel
{
public int PartialInt { get; set; }
public string PartialString { get; set; }
public string PartialString2 { get; set; }
}
public enum Visibility
{
Visible = 1,
Hidden
}
}
查看
<h2>Index</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>TestModel</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.Label("Visibility", htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.DropDownList("Vis", new SelectList(Enum.GetValues(typeof(Visibility))),
"Select",
new {
@id = "ddlVis",
@class = "form-control"
//onchange = @"ddlChanged();"
})
</div>
<br />
@Html.LabelFor(model => model.SelectedItem, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.SelectedItem, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.SelectedItem, "", new { @class = "text-danger" })
</div>
</div>
<div id="partialPlaceHolder">
@Html.Partial("_PartialTest", Model.Partial,
new ViewDataDictionary(Html.ViewData)
{
TemplateInfo = new TemplateInfo { HtmlFieldPrefix = Html.NameFor(m => m.Partial).ToString() }
})
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
}
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
$('#ddlVis').change(function () {
/* Get the selected value of dropdownlist */
var selectedID = $(this).val();
if (selectedID == 1) {
// access and modify the model and partial model
}
if ($('#ddlVis').val() == "Visible") {
// I can pass an integer here, but how do I pass in the model to the action?
$.get('/Test/DDLChangedAction/' + 123, function (data) {
/* data is the pure html returned from action method, load it to your page */
$('#partialPlaceHolder').html(data);
$('#partialPlaceHolder').show();
});
} else if ($('#ddlVis').val() == "Hidden") {
$('#partialPlaceHolder').hide();
}
});
function ddlChanged() {
alert("projectPtIndChanged")
if ($('#ddlVis').val() == "Hidden") {
alert("in hide");
//debugger;
$("#divHideTest").hide();
// now let's show the partial
var newString = "Ickle";
$.get('/Test/DDLChangedAction' + newString, function (data) {
$('#partialPlaceHolder').html(data);
});
} else {
alert("in show");
$("#divHideTest").show();
}
}
</script>
}
部分视图
@model WebApplication1.Models.PartialModel
<div>
<fieldset>
<legend>PartialTest</legend>
<dl class="dl-horizontal">
<dt>@Html.DisplayNameFor(model => model.PartialInt)</dt>
<dd>@Html.EditorFor(model => model.PartialInt)</dd>
<dt>@Html.DisplayNameFor(model => model.PartialString)</dt>
<dd>@Html.EditorFor(model => model.PartialString)</dd>
<dt>@Html.DisplayNameFor(model => model.PartialString2)</dt>
<dd>@Html.EditorFor(model => model.PartialString2)</dd>
</dl>
</fieldset>
</div>