Unable to track dropdown events in scheduler popup

[Winnie]

I'm getting an error every time I'm trying to track a popup event type.

All I'm trying to do is to get the console to log the event type whenever a user changes the the dropdown options to start. This keeps throwing an error and I'm wondering if anyone can give me some clue as to what this problem is or maybe a better (or right?) way to write this?

Thanks. 

<script>
    $(document).ready(function() {
        var viewModel = new kendo.observable({
            selectedEventType:"Appointment",
            appointmentTypes : ["Appointment","Other Event"],
            onDataBound: function(e) {
                e.sender.select(0);
                this.set("selectedEventType", e.sender.dataItem());
            },
            changeEventType: function() {
                console.log("event :: change (" + this.get("selectedEventType") + ")");
            },
            schedulerData: [{
                id: 1,
                start: new Date("2013/6/6 08:00 AM"),
                end: new Date("2013/6/6 09:00 AM"),
                title: "Interview"
            }]
        });
        $("#scheduler").kendoScheduler({
            date: new Date("2013/6/6"),
            editable: {
                template: $("#editor").html()
            },
            views: [
                "day",
                { type: "week", selected: true },
                "month",
                "agenda"
            ],
            dataSource: viewModel.schedulerData
        });
    });
</script>

<!-- We can migrate this to a js file upon production -Winnie -->
<script id="editor" type="text/x-kendo-template">
    <form class="form-horizontal">
        <label>Type:</label>
        <select data-role="dropdownlist" data-bind="value:selectedEventType,source:appointmentTypes,events:{change:changeEventType}"></select>

        <label>Client*:</label>
        <input type="text" name="title" />

        <label>Add New Client:</label>
        <a data-role="button" data-click="newClient" id="eventType"><span class="k-icon k-i-plus"></span>New</a>
    </form>
</script>

<script>
    function newClient(e) {
        console.log("new client click");
    };
</script>


<div id="scheduler"></div>

[Rosen]

Hi,

I'm afraid that attaching the event in this way is not currently supported due to the way edit form is bound to the model. Thus, you will need to use the Scheduler's edit event to attached the change handler, similar to the following:

$("#scheduler").kendoScheduler({
     date: new Date("2013/6/6"),
     editable: {
         template: $("#editor").html()
     },
     views: [
         "day",
         { type: "week", selected: true },
         "month",
         "agenda"
     ],
     edit: function(e) {
       e.container
         .find("select")
         .data("kendoDropDownList")
         .bind("change", function() {
           viewModel.changeEventType();
         });
     },
     dataSource: viewModel.schedulerData
 });

Regards,
Rosen
Telerik

[Winnie]

That works great. Thank you!