[英]Passing viewmodel between partial views MVC5
我有一个主视图和两个部分视图。 我需要能够使用我的第一个局部视图中的值填充viewmodel,并在单击按钮时将viewmodel传递给第二个局部视图。 该按钮位于第二个局部视图中。 我已经编写了一个javascript函数来执行此操作,但是当我检查控制器方法时,viewmodel是空的。 正如您在下面的屏幕截图中看到的那样,服务框是第二个局部视图
第一部分视图
第二部分观点
@model CC.GRP.MCRequest.ViewModels.NewRequestViewModel
<div id="NewRequest">
<h1>Services</h1>
@using (Html.BeginForm())
{
@Html.LabelFor(model => model.ProjectName, htmlAttributes: new { @class = "control-label col-md-5" })
@Html.EditorFor(model => model.ProjectName, new { htmlAttributes = new { @class = "form-control", style = "width:100%" } })
<input type="submit" value="Save" class="btn btn-default" onclick="mapInit()" />
}
</div>
<script type="text/javascript">
function mapInit() {
$.ajax({
url: '@Url.Action("Service", "request")',
// datatype: "json",
data: $('form').serialize(), // update this
type: "POST",
// contentType: 'application/json; charset=utf-8'
});
}
</script>
调节器
[HttpPost]
public PartialViewResult Service(NewRequestViewModel model)
{
return PartialView("_NewService", model);
}
以下是我对您如何解决任务的建议:
<input type="button" value="Save" class="btn btn-default" onclick="mapInit()" />
这个当ajax方法之后原始提交事件处理完毕时,有必要不清理表单。 在mapInit函数中,您应该添加一个属性success
并在那里编写一个函数来手动更新您的第二个部分表单:
function mapInit() { $.ajax({ url: '@Url.Action("Service", "request")', // datatype: "json", data: $('form').serialize(), // update this type: "POST", success: function (data) { var html = $(data).find('form').html(); $('#NewRequest').find('form').html(html); } }); }
因此,假设您的第一个部分表单具有相同的字段,您将能够用您想要的内容填充您的第二个表单。
1)为部分视图创建一个get或post动作。这会将您发布的模型作为参数并返回第二个局部视图。
2)在UI中修改局部视图的BeginForm字段并添加OnSuccess事件。(例如Handel OnSuccess )
3)创建Jquery方法以获取成功请求并将第一个局部视图内容替换为UI中的第二个。(例如:$('#PartialView1Container')。html(result);)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.