我正在为DNN创建一个MVC模块,并尝试将一个表单作为局部视图返回,以允许从用户输入动态数量的对象,但是当我对我的动作路径进行AJAX调用时返回PartialView并将其附加到在页面上,我收到了包含在DNN皮肤布局中的整个页面的HTML。
我按照示例从DNN的official samples repo和this general MVC guide渲染部分视图。我确保从我的ActionResult返回一个PartialView,并在我的局部视图Razor模板中将Layout设置为null。
我的行动:
public PartialViewResult BlankEducationForm()
{
return PartialView(new Education());
}
我的部分观点:
@inherits DotNetNuke.Web.Mvc.Framework.DnnWebViewPage<Chris.Modules.ResumeTest2.Models.Education>
@{
Layout = null;
}
@using System.Text.RegularExpressions
@using DotNetNuke.Web.Mvc.Helpers
<div class="education-editor">
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">School Name:</label>
@Html.TextBoxFor(m => m.SchoolName, new { @class = "form-control", @placeholder = "Degree" })
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">Degree(s) Earned:</label>
@Html.TextBoxFor(m => m.Degree, new { @class = "form-control", @placeholder = "Degree" })
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputEmail4">Start Year:</label>
@Html.TextBoxFor(m => m.StartYear, new { @class = "form-control", @placeholder = "Start Year" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">End Year:</label>
@Html.TextBoxFor(m => m.EndYear, new { @class = "form-control", @placeholder = "End Year" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">Display Order:</label>
@Html.TextBoxFor(m => m.Order, new { @class = "form-control", @placeholder = "Order" })
</div>
</div>
</div>
使用AJAX调用调用它的父视图:
@inherits DotNetNuke.Web.Mvc.Framework.DnnWebViewPage<Chris.Modules.ResumeTest2.Models.Resume>
@using System.Text.RegularExpressions
@using DotNetNuke.Web.Mvc.Helpers
<div id="[email protected]">
<div id="resume-container">
<form method="post" action="@Url.Action("Create", "Resume")">
<h1>General Information</h1>
<div class="form-group">
<label for="exampleInputPassword1">Resumé Name:</label>
@Html.TextBoxFor(m => m.ResumeName, new { @class = "form-control", @placeholder = "Resume Name" })
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputEmail4">First Name:</label>
@Html.TextBoxFor(m => m.FirstName, new { @class = "form-control", @placeholder = "First Name" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">Last Name:</label>
@Html.TextBoxFor(m => m.LastName, new { @class = "form-control", @placeholder = "Last Name" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">Middle Name:</label>
@Html.TextBoxFor(m => m.MiddleName, new { @class = "form-control", @placeholder = "Middle Name" })
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">Address 1</label>
@Html.TextBoxFor(m => m.Address1, new { @class = "form-control", @placeholder = "Address 1" })
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">Address 2</label>
@Html.TextBoxFor(m => m.Address2, new { @class = "form-control", @placeholder = "Address 2" })
</div>
</div>
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputEmail4">City:</label>
@Html.TextBoxFor(m => m.City, new { @class = "form-control", @placeholder = "City" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">State:</label>
@Html.TextBoxFor(m => m.State, new { @class = "form-control", @placeholder = "State" })
</div>
<div class="form-group col-md-4">
<label for="inputPassword4">ZIP:</label>
@Html.TextBoxFor(m => m.Zip, new { @class = "form-control", @placeholder = "ZIP" })
</div>
</div>
<div class="form-row">
<div class="form-group col-md-6">
<label for="inputEmail4">Phone Number:</label>
@Html.TextBoxFor(m => m.Phone, new { @class = "form-control", @placeholder = "Phone" })
</div>
<div class="form-group col-md-6">
<label for="inputPassword4">E-Mail:</label>
@Html.TextBoxFor(m => m.Email, new { @class = "form-control", @placeholder = "E-mail" })
</div>
</div>
<h1>Education</h1>
<div id="education-forms"></div>
@Html.ActionLink("Add another...", "BlankEducationForm", "Resume", null, new { id = "addItem" })
@Html.HiddenFor(m => m.ResumeId)
<button type="submit" class="dnnPrimaryAction">Create</button>
</form>
</div>
<script>
$('#addItem').click(function () {
$.ajax({
url: this.href,
cache: false,
success: function (html) {
$('#education-forms').append(html);
}
});
return false;
});
</script>
</div>
它确实从请求中插入HTML,其中包括表单,但由于某种原因,它认为我想要整个页面。我不确定DNN识别我的控制器是否存在某种问题,但我没有理由期待它。我真的很难过。
在ajax调用的成功函数中,而不是使用:
success: function (html) {
$('#education-forms').append(html);
}
请尝试以下方法:
success: function (html) {
$('#education-forms').html(html);
}
///更新以跟进评论
部分视图的.cshtml是什么?例如,如果它被称为_MyPartialView.cshtml,请尝试下列其中一项(如果需要.cshtml则不记得我的头顶):
public PartialViewResult BlankEducationForm()
{
return PartialView("_MyPartialView", new Education());
return PartialView("_MyPartialView.cshtml", new Education());
}
您需要像这样设置RouteConfig.cs
public class RouteConfig : IMvcRouteMapper {
public void RegisterRoutes(DotNetNuke.Web.Mvc.Routing.IMapRoute mapRouteManager) {
mapRouteManager.MapRoute("ModuleNameHere", "ControllerNameHere", "{controller}/{action}", new[]
{"ControllerNamespaceHere.Controllers"});
}
}
然后你需要在你的ajax调用中使用这样的url
'/DesktopModules/MVC/ModuleName/ControllerName/ActionName';
这可以防止dnn注入标头和其他所有内容。