我有以下网格，其中有一个嵌套的 TabStrip，用于编辑人员的不同方面。这些字段在选项卡中相互关联，因此我需要它们在切换选项卡时自动重新加载，这不是默认行为。
@(Html.Kendo().Grid<PersonModel>()
.Name("PersonGrid")
.ClientDetailTemplateId("PersonTemplate")
Blah…
Blah…
Blah…
)
<script id="PersonTemplate" type="text/x-kendo-template">
@(Html.Kendo().TabStrip()
.Name("TabStrip_#=Id#")
.Items(items => {
items.Add().Text("Contact Information").LoadContentFrom("PersonInfo", "People", new {personId = "#=Id#"}).Selected(true);
items.Add().Text("Incident History").LoadContentFrom("PersonIncidents", "People", new {personId = "#=Id#"});
items.Add().Text("Edit Qualifications").LoadContentFrom("PersonQualifications", "People", new {personId = "#=Id#"});
})
.Events(e => e.Activate("reloadTab"))
.ToClientTemplate()
)
</script>
如果 TabStrip 未嵌套在网格中，我将使用以下脚本来激活事件。
<script type="text/javascript">
function reloadTab(e) {
$('#TabStrip').data('kendoTabStrip').reload(e.item);
}
</script>
我尝试将 JavaScript 嵌套到脚本模板中，但没有成功。
如有任何帮助，我们将不胜感激!
最佳答案
您偶然发现了一个非常棘手的问题。你可能已经很接近了。重做您的模板以动态生成事件所需的 JavaScript。
我用 >>> 标记了我认为是技巧的两行。
<script id="PersonTemplate" type="text/x-kendo-template">
<script type="text/javascript">
function reloadTab_#=Id#(e) {
>>> $('\#TabStrip_#=Id#').data('kendoTabStrip').reload(e.item);
}
>>> <\/script>
@(Html.Kendo().TabStrip()
.Name("TabStrip_#=Id#")
.Items(items => {
items.Add().Text("Contact Information").LoadContentFrom("PersonInfo", "People", new {personId = "#=Id#"}).Selected(true);
items.Add().Text("Incident History").LoadContentFrom("PersonIncidents", "People", new {personId = "#=Id#"});
items.Add().Text("Edit Qualifications").LoadContentFrom("PersonQualifications", "People", new {personId = "#=Id#"});
})
.Events(e => e.Activate("reloadTab_#=Id#"))
.ToClientTemplate()
)
</script>
两个反斜杠字符就是窍门。第一个是让 Kendo 不会因为尝试解析动态 jQuery 引用而 panic ，第二个则可以防止您在完成之前关闭模板。
祝你编码愉快!
关于javascript - 当嵌套在 Kendo 网格中时如何重新加载 Kendo TabStrip 选项卡，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15512890/