Scheduler event color doesn't show with datasource autobind set to false

9 posts, 0 answers
  1. Oliver
    Oliver avatar
    8 posts
    Member since:
    Jun 2015

    Posted 23 Sep Link to this post

    Hello,

    Scheduler event color doesn't show with datasource autobind set to false

    Datasource of the scheduler is being read after dropdownlist is loaded  ...

            var scheduler = $("#scheduler").data("kendoScheduler");
            scheduler.dataSource.read();

     

    Once the editor was open and closed, the color of the events will be shown, see attachment.

     

  2. K.Ramadan
    K.Ramadan avatar
    78 posts
    Member since:
    Feb 2020

    Posted 23 Sep Link to this post

    hello Oliver,

    can you please show the scheduler widget !

    maybe i can reproduce the problem on my side, and then help you.

  3. Oliver
    Oliver avatar
    8 posts
    Member since:
    Jun 2015

    Posted 23 Sep Link to this post

    Hello blackout,

    here the scheduler widget ...

     

    @(Html.Kendo().Scheduler<MSE1.Areas.Scheduler.ViewModels.Scheduler_ViewModel>()
            .Name("scheduler").Timezone("Etc/UTC").Height(680).MajorTick(120)
                .Date(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day))
                .StartTime(new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, 00, 00, 00))
                .AllDaySlot(false)
                .Editable(editable =>
                {
                    editable.TemplateName("Scheduler");
                    editable.Resize(false); editable.Update(false); editable.Move(false);
                })
                .Height(600).HtmlAttributes(new { @class = "small" })
                .Views(views =>
                {
                    views.DayView();
                    views.WeekView(view => view.Selected(true));
                    views.MonthView();
                    views.AgendaView();
                    views.TimelineView();
                })
                    .EventTemplate("# if (Active == true) { # <div style=\"width: 100%; height: 100%;\" title=\"(#= kendo.toString(start, \"HH:mm\") # - #= kendo.toString(end, \"HH:mm\") #) #=title# #=RecurrenceInfo#\"><p style=\"padding: 5px;\">#=kendo.toString(start, \"HH:mm\")# - #=kendo.toString(end, \"HH:mm\")# \\# #=RecurrenceInfo# \\# #=title# \\# #=UserName#</p></div> # } else { # <div style=\"width: 100%; height: 100%;\" class=\"stripes\" title=\"#= title #\"><p style=\"padding: 5px;\">#= title #</p></div> # } #")

                    .Resources(resource =>
                    {
                        resource.Add(m => m.CategoryId).Title("Event").DataTextField("Text").DataValueField("Value").DataColorField("Color")
                        .BindTo(scheduler_categories);
                    })
                    .DataSource(d => d
                    .Model(m => {
                        m.Id(f => f.Id);
                        m.Field(f => f.Title).DefaultValue("No title");
                        m.Field(f => f.CategoryId).DefaultValue(1);
                        m.Field(f => f.Active).DefaultValue(true);
                        m.RecurrenceId(f => f.RecurrenceId);
                    })
                        .Read(read => read.Action("Scheduler_Read", "Scheduler", new { area = "Scheduler" }).Data("fn_scheduler_data"))
                        )
                    .AutoBind(false)
        )


  4. K.Ramadan
    K.Ramadan avatar
    78 posts
    Member since:
    Feb 2020

    Posted 23 Sep in reply to Oliver Link to this post

    Hello Oliver,

    from what i can understand from this PAGE that if you set the autobind to false, it will not bind (it will not get the colors) until a Change event is fired .. so maybe try to set to true !

  5. K.Ramadan
    K.Ramadan avatar
    78 posts
    Member since:
    Feb 2020

    Posted 23 Sep Link to this post

    this is the PAGE : https://docs.telerik.com/kendo-ui/api/javascript/ui/scheduler/configuration/autobind

    there you will find your answer.

     

    in my previous post I meant Change Event of the dataSource. That will also apply for dataSources for the resources used in the widget.

    and the Change Event of the dataSource is being fired on this line :

    scheduler.dataSource.read();

  6. Oliver
    Oliver avatar
    8 posts
    Member since:
    Jun 2015

    Posted 23 Sep in reply to K.Ramadan Link to this post

    Thanks for the hint!

    Didn't know that this will also affect the resources dataSource.

  7. Neli
    Admin
    Neli avatar
    341 posts

    Posted 25 Sep Link to this post

    Hello,

    Indeed, as it is written in the Scheduler API documentation when the autobind is set to false, the configuration will be applied also to the resources.

    I would also suggest you try to refresh the Scheduler by using the refresh() method and check if it resolves the issue.

    I hope this helps.

    Regards,
    Neli
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

  8. Oliver
    Oliver avatar
    8 posts
    Member since:
    Jun 2015

    Posted 25 Sep in reply to Neli Link to this post

    Hello Neli,

    i've set autobind to true for the scheduler and added an optional label to my dropdownlist.

    So on page load the dropdownlist value is empty and shows an empty scheduler.

    I think thats OK for now ...

    Thank you for your help!

  9. Neli
    Admin
    Neli avatar
    341 posts

    Posted 29 Sep Link to this post

    Hello Oliver,

    Thank you for the feedback and for sharing the steps that helped you to resolve the issue. We always appreciate any feedback as it could be helpful for someone else in the future who has a similar scenario.

    Regards,
    Neli
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top