Scheduler dropdownlist not working with datasource binding

[Support]

I have a scheduler code like below, but it is not working although it has rendered a drop-down list but no data inside. Any help?

<script id="popup_editor" type="text/x-kendo-template">
    <div class="k-edit-form-container">
        <div class="k-edit-label"><label for="Product">Product</label></div>
        <div id="example" class="k-edit-field" data-container-for="ProductID">
            <input data-role="dropdownlist" data-text-field="Name" data-value-field="Id" data-bind="source: arr" />
        </div>
    </div>
</script>

@(Html.Kendo().Scheduler<KendoUI.Northwind.Dashboard.Controllers.ScheduleTableViewModel>()
    .Name("scheduler")
    .Editable(editable => editable
        .EditRecurringMode(SchedulerEditRecurringMode.Dialog)
    .TemplateId("popup_editor")
    )
    .Selectable(false)
    .Views(views =>
    {
        views.DayView();
        views.WeekView();
        views.WorkWeekView(workWeekView => workWeekView.Selected(true));
        views.MonthView();
        views.AgendaView();
        views.TimelineView();
    })
    .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.RecId);
            m.Field(f => f.Title).DefaultValue("No title");
            m.RecurrenceId(f => f.RecurrenceID);
        })
        .Read(read => read.Action("ScheduleTables_Read", "SchedulerMvc"))
        .Create(create => create.Action("ScheduleTables_Create", "SchedulerMvc"))
        .Update(update => update.Action("ScheduleTables_Update", "SchedulerMvc"))
        .Destroy(destroy => destroy.Action("ScheduleTables_Destroy", "SchedulerMvc"))
    )

<script>
    var arr = new kendo.data.ObservableArray([
    { Name: "John Doe", Id: 23 },
    { Name: "Jane Doe", Id: 34 }
    ]);

    var viewModel = kendo.observable({
        arr: arr //Temp solution, eventually will bind to a remote
    });

    kendo.bind($("#popup_editor"), viewModel);
</script>

[Support]

I found the since it is in Edit screen, it should initialize during the edit event for bind method.

Html.Kendo().Scheduler<KendoUI.Northwind.Dashboard.Controllers.ScheduleTableViewModel>()
    .Name("scheduler")
    .Editable(editable => editable
        .EditRecurringMode(SchedulerEditRecurringMode.Dialog)
    .TemplateId("popup_editor")
    )
    .Selectable(false)
    .Events(e =>
    {
        e.Edit("scheduler_edit");
    })



function scheduler_edit(e) {
    kendo.bind($("#example"), viewModel);
}

 

Thanks.

[Veselin Tsvetanov]

Hello,

Binding the DropDownList on editing is the appropriate approach in the described scenario.

In case you have any other questions, please do not hesitate to contact us again. 

Regards,
Veselin Tsvetanov
Progress Telerik