在 Kendo Scheduler 的模板中设置 Kendo Tabstrip

Question

当双击"editable" 启用Kendo Scheduler 时，会弹出预设模板window。我想知道是否有任何方法可以向 window 添加 Kendo TabStrip 控件。

Answer 1

你需要做几件事来实现：

创建自定义模板

<div id="scheduler"></div>
<script id="customEditorTemplate" type="text/x-kendo-template">
    <div id="tabstrip">
        <ul>
            <li id="tab1">Tab 1</li>
            <li>Tab 2</li>
        </ul>
        <div>Content 1</div>
        <div>Content 2</div>
    </div>
</script>

在可编辑部分配置自定义模板

在编辑部分附加标签条组件

<script>
    $("#scheduler").kendoScheduler({
        date: new Date("2013/6/6"),
        dataSource: [
            {
                start: new Date("2013/6/6 08:00 AM"),
                end: new Date("2013/6/6 09:00 AM"),
                title: "Breakfast"
            }
        ],
        editable: {
            template: $("#customEditorTemplate").html()
        },
        edit: function (e) {
            $("#tabstrip").kendoTabStrip().data("kendoTabStrip").activateTab($("#tab1"));
        }
    });
</script>

示例代码：http://runner.telerik.io/fullscreen/ofuHU

希望对您有所帮助。

在 Kendo Scheduler 的模板中设置 Kendo Tabstrip

Setting Kendo Tabstrip inside the template of Kendo Scheduler

kendo-ui

kendo-scheduler