我有一个窗口，其内容正在通过部分 View 加载。由于将 jscript 代码放入部分 View 只会导致问题，因此我尝试将其放入包含窗口的 View 中。
调试此页面时，在 DropDownList 事件上加载 View 时，我立即收到未定义错误，并且其他事件也不起作用。我花了几个小时寻找解决方案，但找不到任何东西。
查看:
@model List<CrmProfileVM>
@using DAKCrmImport.Models;
@{
ViewBag.Title = "Index";
}
<h2>Profilübersicht</h2>
@(Html.Kendo().Grid<CrmProfileVM>().Name("gvCrmProfile").BindTo(Model).Columns(c =>
{
c.Template(t => { }).HeaderTemplate("").ClientTemplate(@"
<a href='javascript: void(0)' class='abutton delete' onclick='deleteRow(this)' title='Löschen'>button delete</a>
<a href='javascript: void(0)' class='abutton edit' onclick='editRow(this)' title='Bearbeiten'>button edit</a>")
.Width(250);
c.Bound(i => i.Name);
c.Bound(i => i.JobCount).Title("Jobanzahl");
c.Bound(i => i.CrmType).Title("Typ");
c.Bound(i => i.CreatedBy).Title("Ersteller");
c.Bound(i => i.UserGroup).Title("Benutzergruppe");
c.Bound(i => i.CreatedAt).Title("Erstellt am").Format("{0:dd.MM.yyyy HH:mm:ss}");
c.Bound(i => i.LastUpdatedBy).Title("Letzte Anpassung durch");
c.Bound(i => i.LastUpdatedAt).Title("Letzte Anpassung am").Format("{0:dd.MM.yyyy HH:mm:ss}");
}) //"<a href='" + @Url.Action("Add", "Profile") + "' class='abutton create' title='Neues Profil anlegen'>button create</a>"
.ToolBar(toolBar => toolBar.Template("<a href='javascript: void(0)' class='abutton create' title='Neues Profil anlegen' onclick='createProfile()'>button create</a>"))
.HtmlAttributes(new { style = "height: 680px;" })
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Scrollable()
.ClientDetailTemplateId("tpCrmProfile")
.Groupable()
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.Filterable()
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Model(model => model.Id(p => p.Id))
.Update(update => update.Action("EditingPopup_Update", "Grid"))
.Destroy(update => update.Action("EditingPopup_Destroy", "Grid"))
.Create("Add", "Profile")
)
)
@(Html.Kendo().Window()
.Name("createProfileWindow")
.Title("Profilerstellung")
.Content(@<text>
</text>)
.Draggable()
.Resizable()
.Width(700)
.Height(800)
.Visible(false)
.Iframe(true)
.LoadContentFrom("Add", "Profile")
.Scrollable(false)
.AutoFocus(true)
)
<script>
function createProfile() {
var window = $("#createProfileWindow").data("kendoWindow");
window.open();
window.center();
}
function showDetails() {
}
function onSourceDataTypeSelect(e) {
var dataItem = this.dataItem(e.item);
var ddlSeparator = $("#Separator").data("kendoDropDownList");
if (dataItem.Text == "csv") {
ddlSeparator.enable();
} else {
ddlSeparator.select(0);
ddlSeparator.enable(false);
}
}
</script>
部分 View :
@model DAKCrmImportModel.Model.Entities.Base.CrmProfile
@{
ViewBag.Title = "_CrmProfileAdd";
}
@(Html.Kendo().Notification().Name("gridNotification"))
@using (Html.BeginForm("Save", "Profile", FormMethod.Post, new { Id = "addProfileForm", novalidate = "false" }))
{
<ul id="progressbar">
<li class="active">Grundeinstellungen</li>
<li>CRM-Einstellungen</li>
<li>Mapping anlegen</li>
</ul>
<fieldset id="fs1">
<h2 class="fs-title">Grundinformationen</h2>
<div class="formClearContainer">
@(Html.ActionLink("Formular leeren", MVC.Profile.ClearForm(), new { @class = "clearForm" }))
</div>
@Html.LabelFor(model => model.Name, new { @class = "label req" })
@Html.TextBoxFor(model => model.Name, new { @class = "input" })
@Html.LabelFor(model => model.Description, new { @class = "label" })
@Html.TextAreaFor(model => model.Description, new { @class = "input", rows = "3", cols = "25" })
@Html.LabelFor(model => model.UserGroupId, new { @class = "label req" })
@(Html.Kendo().DropDownListFor(model => model.UserGroupId)
.OptionLabel("Bitte auswählen... ")
.BindTo(Model.UserGroupList)
.Popup(p => p.AppendTo("#fs1"))
)
@(Html.LabelFor(model => model.SourceDataType, new { @class ="label req" }))
@(Html.Kendo().DropDownListFor(m => Model)
.BindTo(EnumHelper.GetSelectList(typeof(DAKCrmImportModel.Model.Entities.Base.SourceDataType)))
.OptionLabel("Bitte auswählen... ")
.Name("SourceDataType")
.Events( e=>
{
e.Select("onSourceDataTypeSelect");
}))
@(Html.LabelFor(model => model.Separator, new { @class="label req" }))
@(Html.Kendo().DropDownListFor(m => Model)
.BindTo(EnumHelper.GetSelectList(typeof(DAKCrmImportModel.Model.Entities.Base.SeparatorType)))
.OptionLabel("Bitte auswählen... ")
.Name("Separator")
.Events( e=>
e.Select("onSeparatorTypeSelect"))
.Enable(false))
<input type="button" name="next" class="next action-button" value="Weiter" style="display:block"/>
</fieldset>
<fieldset id="fs2">
<h2 class="fs-title">CRM-Einstellungen</h2>
<div class="formClearContainer">
@(Html.ActionLink("Formular leeren", MVC.Profile.ClearForm(), new { @class = "clearForm" }))
</div>
@Html.LabelFor(model => model.OrdnungsbegriffTypeId, new { @class = "label req" })
@(Html.Kendo().DropDownListFor(model => model.OrdnungsbegriffTypeId)
.OptionLabel("Bitte auswählen...")
.BindTo(Model.OrdnungsbegriffTypeList)
.Popup(p => p.AppendTo("#fs2"))
)
@Html.LabelFor(model => model.CrmTypeId, new { @class = "label req" })
@(Html.Kendo().DropDownListFor(model => Model.CrmTypeId)
.Name("CrmTypeId")
.OptionLabel("Bitte auswählen...")
.BindTo(Model.CrmTypeList)
.Popup(p => p.AppendTo("#fs2"))
.Events(e =>
e.Select("onCrmTypeSelect"))
)
<br />
<input type="button" name="previous" class="previous action-button" value="Zurueck" />
<input type="button" name="next" class="next action-button" value="Weiter" />
</fieldset>
<fieldset>
<h2 class="fs-title">Mapping anlegen</h2>
<div class="formClearContainer">
@(Html.ActionLink("Formular leeren", MVC.Profile.ClearForm(), new { @class = "clearForm" }))
</div>
@(Html.Kendo().Upload()
.Name("upMappingFile")
.Multiple(false)
.ShowFileList(true)
.TemplateId("fuCsvTemplate")
.Async(a => a
.AutoUpload(true)
.Save("SaveFile", "Mapping")
.Remove("RemoveFile", "Mapping")
)
.Enable(false)
.Events(e => e
.Success("onSuccess")
.Upload("onUpload"))
.Messages(m => m
.Select("Durchsuchen...")
.HeaderStatusUploading("Uploading...")
.HeaderStatusUploaded("Fertig"))
)
<div id="gridContainer">
</div>
@*<div id="appendTo" class="k-block"></div>*@
<input type="button" name="previous" class="previous action-button" value="Zurueck" />
<input type="submit" name="submit" class="submit action-button" value="Speichern"/>
</fieldset>
}
Controller 操作结果:
public virtual ActionResult Add()
{
CrmProfile crmProfile = new CrmProfile();
crmProfile = GetCrmProfile(crmProfile);
return PartialView("_CrmProfileAdd", crmProfile);
}
这不是完整的代码，但将所有代码放在这里有点大材小用。
所以..简单的问题:为什么部分 View 在包含它的 View 中找不到事件？我怎样才能优雅地解决这个问题？
提前谢谢各位。 :)
[更新1] 因此，在将脚本引用从部分 View 中取出之后，这是我无论如何都必须做的事情。当页面尝试启动 Kendo/Telerik-controlls 之一时，我收到“jQuery 未定义”错误 .. yaaaayy。
jQuery(function(){jQuery("#UserGroupId").kendoDropDownList({"dataSource":[{"Text":"0023 10 - VZ_RSA","Value":"1"}],"dataTextField":"Text","popup":{"appendTo":"#fs1"},"dataValueField":"Value","optionLabel":"Bitte auswählen... "});});
我再次开始研究并尝试将 @section 脚本放入 View 中并插入所有脚本。不幸的是它没有做任何事情，是的，我的 _Layout 中确实有 RenderSection 部分。我真的不知道发生了什么事。顺便说一句，Fiddler 也没有显示任何错误。
布局:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@*<link rel="stylesheet" href="http://kendo.cdn.telerik.com/<kendo ui version>/styles/kendo.common-bootstrap.min.css" />
<link rel="stylesheet" href="http://kendo.cdn.telerik.com/<kendo ui version>/styles/kendo.bootstrap.min.css" />*@
<title>@ViewBag.Title - Meine ASP.NET-Anwendung</title>
@Scripts.Render("~/bundles/modernizr")
@Styles.Render("~/Content/kendo/css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/kendo")
@Scripts.Render("~/bundles/jqueryeasing")
</head>
<body>
<div id="wrapper">
<header>
<div id="logo"></div>
<div id="logoHead">CrmImport</div>
<div id="links">
<a href="#">Über uns</a>
<a href="#">Hilfe</a>
<a href="#">Kontakt</a>
</div>
</header>
<div id="breadCrumpContainer">
<div id="breadCrump">@ViewContext.RouteData.Values["controller"]</div>
</div>
<nav>
<ul id="menu">
@* Linkname, Action, Controller *@
<li>@Html.ActionLink("Home", MVC.Home.Index()) </li>
<li>
@Html.ActionLink("Meine Profile", MVC.Profile.Index())
</li>
<li>
@Html.ActionLink("Meine Jobs", MVC.Profile.Index())
</li>
<li>
<a href="#">Administration</a>
<ul>
<li>@Html.ActionLink("Usergruppen verwalten", "Index", "UserGroups")</li>
<li>@Html.ActionLink("Log", "Index", "Log")</li>
<li>@Html.ActionLink("Globale Profile", "Index", "GlobalProfiles")</li>
<li>@Html.ActionLink("News verwalten", "Index", "News")</li>
</ul>
</li>
<content>
<div id="userBox">
@Html.Action("_User", "User")
</div>
</content>
</ul>
</nav>
</div>
<div id="content">
@RenderBody()
</div>
<div id="push"></div>
<footer>Copyright © DAK-Gesundheit 2015</footer>
@RenderSection("scripts", required: false)
</body>
</html>
<link href="~/Styles/Main.css" rel="stylesheet" />
最佳答案
最后，问题是 Kendo.Window 或者更确切地说，是在构建父 View 时加载内容的时间。
为了解决这个问题，当我单击特定按钮进行编辑和创建时，我必须加载 Windows 内容。
您可以忽略整个 href 部分。这是为了调试。
function createProfile() {
var window = $("#createProfileWindow").data("kendoWindow");
//Dynamisches Vorgehen nicht möglich. Daher muss die URL untersucht werden
//Hinweis: Für Produktiv/Test ist diese Funktion wahrscheinlich nicht notwendig, da Index nie "direkt" aufgerufen wird
var url = 'Profile/Add';
if ($(location).attr('href').indexOf("Index") >= 0) {
url = '@MVC.Profile.ActionNames.Add';
}
$("#createProfileWindow").kendoWindow({
content: {
url: url
}
});
window.open();
window.center();
profileId = null;
}
关于javascript - MVC - PartialView 在 View 中找不到事件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33007438/