Update model values on click of task

2 posts, 0 answers
  1. Sage
    Sage avatar
    3 posts
    Member since:
    Apr 2014

    Posted 15 Apr 2014 Link to this post

    So I'm pretty new to using this component, so I'm not very familiar with it yet.

    Here's what I'm trying to do:

    I have a scheduler that I'm pre-populating with a lot of tasks.  I don't want the user to be able to add, delete, or update anything.  However, on selecting or clicking (or double clicking, whatever works best) I want to be able to update some other value in the model that was passed into the view.

    For example: When user clicks on a task at 12:00 PM I don't want to show any pop ups or anything, but I want to set Model.appontmentTime equal to the tasks start time (i.e. 12:00 PM).

    Also, as a side issue, for some reason when I attach a task to an owner as listed in the resources, the task is not showing in the right color.  Am I doing something wrong there?

    So Far I have:

    02.            .Name("timeSlots")
    03.            .Views(views => { views.WeekView(); })
    04.            .Height(300)
    05.            .Date(Model.appointmentCalendarRenderStartDate)
    06.            .Height(400)
    07.            .AllDaySlot(false)
    08.            .MajorTick((int)Model.timeSlotInterval.TotalMinutes)
    09.            .MinorTickCount(1)
    10.            .Min(Model.appointmentCalendarRenderStartDate)
    11.            .Max(Model.appointmentCalendarRenderFinishDate)
    12.            .Resources(resource =>
    13.            {
    14.                resource.Add(m=> m.OwnerID)
    15.                    .Title("Owner")
    16.                    .DataTextField("Text")
    17.                    .DataValueField("Value")
    18.                    .DataColorField("Color")
    19.                    .BindTo(new[] {
    20.                        new { Text = "Many", Value = 1, color = "#003300"},
    21.                        new { Text = "Few", Value = 2, color = "#CC3300"}
    22.                    });
    23.            })
    24.            .DataSource(d => d
    25.                .Model(m => {
    26.                    m.Id(f => f.TaskID);
    27.                    m.Field(f => f.Title).DefaultValue("No title");
    28.                    m.Field(f => f.OwnerID).DefaultValue(1);
    29.                    m.Field(f => f.Title).DefaultValue("No title");
    30.                    m.RecurrenceId(f => f.RecurrenceID);
    31.                })
    33.            )
  2. Vladimir Iliev
    Vladimir Iliev avatar
    2179 posts

    Posted 17 Apr 2014 Link to this post

    Hi Sage,

    Please find the answers of your questions below:

    1) On selecting or clicking (or double clicking, whatever works best) I want to be able to update some other value in the model that was passed into the view - Basically updating the ViewModel after the View initialization would not be possible without refreshing the page, however if you need to execute custom code on double-click on the Scheduler you can achieve that behavior as demonstrated below:

    $(function () {
        //place the code after scheduler initialization:
        var scheduler = $("#scheduler").data("kendoScheduler");
        scheduler.element.bind("dblclick", ".k-scheduler-content td", function (e) {
            var slot = scheduler.slotByElement(e.target);
            alert("Clicked slot start time is: " + slot.startDate + " and end time is: " + slot.endDate );

    2) the task is not showing in the right color - the reason for current behavior is that the "Color" field in the data for the resources is typed with lower letter. After fixing it the colors will be rendered as expected:

    .BindTo(new[] { new { Text = "Many", Value = 1, Color = "#003300"},

    Vladimir Iliev

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

Back to Top