javascriptasp.net-mvckendo-uikendo-asp.net-mvckendo-scheduler

Kendo scheduler can't edit event in mobile mode


I am facing a problem with my Kendo Scheduler while in mobile mode.

I can't edit my events in my kendo scheduler while using the mobile mode, while I can in desktop mode.

I tried to add a Mobile(MobileMod.Phone) or auto or something else, there is no change on it.

I saw something about an instatiate of kendo mobile app, but I didn't understand how it works. If someone already faceed this problem, would be great :). I puted some code for better understanding of my scheduler.

<div class="flex-grow-1 flex-col" @*data-role="view"*@>
@(Html.Kendo().Scheduler<PlanningModel>()
    .Name("PlanningLitsScheduler")
    .Mobile(MobileMode.Auto)
    .WorkWeekStart(0)
    .WorkWeekEnd(6)
    .Date(DateTime.Now)
    .Height(441)
    .MajorTick(1440)
    .Editable(e => e.TemplateName("CustomViewTemplate"))
    .Group(group => group.Resources("Chambres").Orientation(SchedulerGroupOrientation.Vertical))
    .HtmlAttributes(new { style = "margin-bottom: 20px; border: 1px solid #FFB41D" })
    .Views(views =>
    {
        views.CustomView("CustomWeekView");
        views.WeekView();
    })
    .Timezone("Etc/UTC")
    .GroupHeaderTemplate("<th class='k-slot-cell'>#:text#</th>")
    .Resources(resource =>
    {
        resource.Add(m => m.ChambreId)
            .Title("Chambre")
            .Name("Chambres")
            .DataTextField("NumChambre")
            .DataValueField("Id")
            .BindTo(Model.ListChambres);

        resource.Add(m => m.LitId)
            .Title("Lit")
            .Name("Lits")
            .DataTextField("NumLit")
            .DataValueField("Id")
            .BindTo(Model.ListChambres[0].ListLits);
    })
    .Events(e => e.DataBound("DataBound").Edit("Edit").MoveStart("DisableDragDrop").Navigate("Navigate").Save("Save").Add("Add"))
    .DataSource(d => d
        .Model(m =>
        {
            m.Id(f => f.TaskID);
            m.Field(f => f.TaskID).DefaultValue(-1);
            m.Field(f => f.Title);
            m.Field(f => f.Description);
            m.Field(f => f.Start);
            m.Field(f => f.End);
            m.Field(f => f.RecurrenceRule);
            m.Field(f => f.RecurrenceID);
            m.Field(f => f.RecurrenceException);
            m.Field(f => f.OwnerID);
            m.Field(f => f.IsAllDay);
            m.Field(f => f.StartTimezone);
            m.Field(f => f.ChambreId);
            m.Field(f => f.EndTimezone);
            m.RecurrenceId(f => f.RecurrenceID);
        })
        .Batch(true)
        .Create(create => create.Action("CreateTachesScheduler", "Bloc").Data("GetDataLengthForCreate"))
        .Read("AjoutTachesScheduler", "Bloc")
        .Update(update => update.Action("UpdateTachesScheduler", "Bloc"))
    )
)</div>

and there is the kendo mobile app I was talking before :

<script type="text/javascript">
let app = new kendo.mobile.Application($("#main"));</script>

Solution

  • It looks like the line .Mobile(MobileMode.Auto) was enough. It does not work when we are on a desktop using a mouse while on smartphone/tablet mode, but it works while using your fingers on a tactile screen.