I'm trying to implement the Scehduler of Kendo UI in ASP.Net MVC (Razor).
While the scheduler doesn't find any data for the current month view and i change month the scheduler is calling the server to get the data for the new month. If the server return any event, the scheduler is never calling the server again even if i change month on the scheduler with their < > button.
I've put debugger in getAdditionalData (javascript) and Lister (Controller) and both never get called again.
Anyone know which thing did i do wrong ?
Here is the code we use:
Razor:
Html.Kendo().Scheduler<CalendrierEventViewModel>()
.Name("schedulerCalendrier")
.DataSource(ds =>
{
ds.Model(model => model.Id(x => x.Id));
ds.Read(read => read.Action("Lister", "Calendrier").Data("getAdditionalData"));
})
.Resources(resources =>
{
resources.Add(m => m.ColorId)
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[]
{
new { Value = STDConsts.TraitementSuccesColorId, Color = "#009106" }, // Vert
new { Value = STDConsts.TraitementErreurColorId, Color = "#ff2909" }, // Rouge
new { Value = STDConsts.NouveauTraitementColorId, Color = "#59006b" }, // Mauve
new { Value = STDConsts.NouveauEssaiColorId, Color = "#c9be00" }, // Jaune
new { Value = STDConsts.NouveauDepotInterneColorId, Color = "#0006a4" }, // Bleu poudre
new { Value = STDConsts.NouveauDepotExterneColorId, Color = "#BBDEFB" }, // Bleu marin
new { Value = STDConsts.DonneeConvertieColorId, Color = "#0500ef" }, // Bleu
});
})
.EventTemplateId("event-template")
.Views(views =>
{
views.MonthView(montView => montView.Selected(true));
})
.Editable(false)
Javascript:
<script>
var vehiculeMultiSelect;
function getAdditionalData() {
var scheduler = $("#schedulerCalendrier").data("kendoScheduler");
var vehiculeIds = [];
if (vehiculeMultiSelect === undefined) {
$("#vehiculeList option:selected").each(function (index, element) {
vehiculeIds.push($(this).val());
});
} else {
vehiculeIds = vehiculeMultiSelect.getIds();
}
var result = {
start: scheduler.view().startDate().toISOString(),
end: scheduler.view().endDate().toISOString(),
vehiculeIds: vehiculeMultiSelect !== undefined ? vehiculeMultiSelect.getIds() : vehiculeIds
}
return result;
}
</script>
Event Template
<script id="event-template" type="text/x-kendo-template">
<div title="#= title #">
<div class="k-event-template">
<a class="calendar-event" href="@Url.Action("Index", "Historique", new { Area = "Suivi" })?Date=#= kendo.toString(start, 'yyyy-MM-dd') #">
#= title #
</a>
</div>
</div>
</script>
Controller:
[HttpGet]
public ActionResult Index()
{
Collection<VehiculeViewModel> vehicules = _calendrierImpl.GetVehiculesForCurrentUser();
CalendrierViewModel model = new CalendrierViewModel { Vehicules = vehicules.OrderBy(x => x.Nom) };
return View(model);
}
public ActionResult Lister([DataSourceRequest]DataSourceRequest request, DateTime start, DateTime end, int[] vehiculeIds)
{
TempData[STDConsts.VehiculeIdsKey] = vehiculeIds;
Collection<CalendrierEventViewModel> list = _calendrierImpl.GetListCalendrier(start, end, vehiculeIds);
return Json(list.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}