1

我有以下网格，它有一个嵌套的 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 没有嵌套在网格中，我会为 Activate 事件使用以下脚本。

<script type="text/javascript">
    function reloadTab(e) {
        $('#TabStrip').data('kendoTabStrip').reload(e.item);
    }
</script>

我试图将 JavaScript 嵌套到 Script 模板中，但无济于事。

任何帮助，将不胜感激！

4

2 回答 2

2

您好，这可以通过 TabStrip 的 reload 方法轻松实现。

       var ps = $(tabstrip).data().kendoTabStrip;
       ps.tabGroup.on('click','li',function(e){        
       ps.reload($(this));
      });
于 2014-05-01T20:28:36.443 回答
2

您偶然发现了一个非常棘手的问题。你可能非常接近。重做模板以动态生成事件所需的 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 引用而发疯，第二个是让您在完成之前无法关闭模板。

快乐编码！

于 2013-03-20T00:16:16.857 回答