How to get tasks to render in calendar using AJAX binding

[Jerry]

We are trying to use the @(Html.Kendo().Scheduler<myModel>() in Asp.net.

When I use Server Binding, and when my calendar page first displays, the tasks display in the calendar as expected.
Here is my Invoke method:
public async Task<IViewComponentResult> InvokeAsync()
List<myModel> myTasks = GetTasksfortheMonth();
return View(myTasks); //These display on calendar as expected

But when I switch months, I want to call the Read() method again to get that months data.
So I switched to using AJAX Binding.
Now when my calendar first displays or whenever I change months, my controller methods is called(below). But the tasks don't display in the calendar.

How do I get my tasks to display in the calendar when using AJAX binding?

My .cshtml
@Html.Kendo().Scheduler<myModel>()
....
.EventTemplate(
"<div class='movie-template'>" +
"<p>" +
"<h3> Title: #= title #</h3>" +
"</p>" +
"</div>")
.DataSource(d => d
.Model(m =>
{
m.Field(f => f.Title).DefaultValue("No title");
m.Field(f => f.Description).DefaultValue("no desc");
})
.Read("Read", "MyController") //this calls my controller method but no tasks appear in calendar
)
//.BindTo(Model)  //Works for Server Binding, tasks appear in calendar when page renders first time

My Controller method:
public virtual JsonResult Read([DataSourceRequest] DataSourceRequest request)
{
List<myModel> myTasks = GetTasksfortheMonth();
return Json(myTasks.ToDataSourceResult(request));
}

[Aleksandar]

Hi Jerry,

You mention the Read endpoint is hit Can you confirm data is returned to the View by inspecting the request in the Network Tab of the DevTools? Also are there any errors logged in the console?

If data is returned in the Read request than I can suggest checking if the JSON serialization options are configured. If the response is formatted in camelCase, but the model properties are in PascalCase the binding will not occur as expected. You can either set the JSON serialization as demonstrated in the configuration or modify the DataSource definition to map the model as demonstrated in the Custom DataSource Demo:

.DataSource(d => d
            .Custom()
            .Batch(true)
            .Schema(schema => schema
                .Model(m =>
                {
                    m.Id(f => f.MeetingID);
                    m.Field("title", typeof(string)).DefaultValue("No title").From("Title");
                    m.Field("start", typeof(DateTime)).From("Start");
                    m.Field("end", typeof(DateTime)).From("End");
                    m.Field("description", typeof(string)).From("Description");
                    m.Field("recurrenceID", typeof(int)).From("RecurrenceID");
                    m.Field("recurrenceRule", typeof(string)).From("RecurrenceRule");
                    m.Field("recurrenceException", typeof(string)).From("RecurrenceException");
                    m.Field("isAllDay", typeof(bool)).From("IsAllDay");
                    m.Field("startTimezone", typeof(string)).From("StartTimezone");
                    m.Field("endTimezone", typeof(string)).From("EndTimezone");
                }))
            .Transport(transport => transport
                .Read(read => read.Url("https://demos.telerik.com/kendo-ui/service/meetings")
                      .DataType("jsonp"))
                .Create(create => create.Url("https://demos.telerik.com/kendo-ui/service/meetings/create")
                      .DataType("jsonp"))
                .Destroy(destroy => destroy.Url("https://demos.telerik.com/kendo-ui/service/meetings/destroy")
                      .DataType("jsonp"))
                .Update(update => update.Url("https://demos.telerik.com/kendo-ui/service/meetings/update")
                      .DataType("jsonp"))
                .ParameterMap("parameterMap"))
    )
)

To review the complete source code behind the demos click on the View Source tab and select the file you want to review:

Let me know if the above helps.

Regards,
Aleksandar
Progress Telerik