Question

有没有办法用Kendo Scheduler创建自己的编辑窗口？当我在调度程序中双击事件时，我需要能够打开自己的编辑窗口。

Answer 1

您应该定义editable.template。

例如：

<script id="editor" type="text/x-kendo-template">
    <h3>Edit meeting</h3>
    <p>
        <label>Title: <input name="title" /></label>
    </p>
    <p>
        <label>Start: <input data-role="datetimepicker" name="start" /></label>
    </p>
    <p>
        <label>Start: <input data-role="datetimepicker" name="end" /></label>
    </p>
</script>

并将调度程序初始化为：

$("#scheduler").kendoScheduler({
    date: new Date("2013/6/6"),
    editable: {
        template: $("#editor").html()
    },
    views: [
        { type: "day" }
    ],
    dataSource: [
        {
            id: 1,
            start: new Date("2013/6/6 08:00 AM"),
            end: new Date("2013/6/6 09:00 AM"),
            title: "Interview"
        }
    ]
});

Answer 2

var scheduler = $（＆＃34;＃scheduler＆＃34;）。data（＆＃34; kendoScheduler＆＃34;）;

scheduler.addEvent（{title：＆＃34; New Event＆＃34;，isAllDay：true}）;

Answer 3

实际上，上面的答案显示了如何自定义编辑窗口的内容。如果要替换整个窗口，here是指向Telerik文档的链接，该文档说明了如何执行此操作。

基本上你要做的就是使用调度程序的edit事件并调用.preventDefault（）。之后，您必须添加使用编辑器表单的代码。

function(e) {
    e.preventDefault(); //prevent popup editing
    var dataSource = this.dataSource;
    var event = e.event;

    if (event.isNew()) {
        setTimeout(function() {
            dataSource.add(event);
            editEvent(event);
        });
    } else {
        editEvent(event);
    }
});

不久前我遇到了同样的问题，但信息似乎很难找到，所以我想我可以在这里分享。

使用Kendo Scheduler创建自定义编辑模板

3 个答案: