This is a migrated thread and some comments may be shown as answers.

Kendo UI Scheduler custom events

8 Answers 952 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Riccardo
Top achievements
Rank 1
Riccardo asked on 27 Jun 2014, 11:33 AM
Hi all,

I use the Kendo UI Scheduler for simple agenda management. What I need to achieve is that a user can click in the scheduler and select a slot (basic behaviour). I don't want a popup to showup but I just need to respond to the selecting of a timeslot in the scheduler. I can use the change event but that one is fired multiple times when I select a few hours for example. 

Is there a way to attach events like mouseup or dragend to respond to this user behaviour? 

I would be thrilled to solve this.

Riccardo Becker

8 Answers, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 01 Jul 2014, 03:03 PM
Hi Riccardo,

You could still use the change event and check if there are any events selected:

    function scheduler_change(e) {
        if (e.events.length) {
          console.log(e.events[0].title)
        }
    }

Here is a live demo: http://trykendoui.telerik.com/@korchev/abUZ

You can use only jQuery and add a handler for the ".k-event" class: 

  $("#scheduler").on("click", ".k-event", function(e) {
    var scheduler = $("#scheduler").data("kendoScheduler");
    
    var event = scheduler.dataSource.getByUid($(e.currentTarget).attr("data-uid"));
    
    alert(event.title);
  });

Here is another demo: http://trykendoui.telerik.com/@korchev/Idug

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Riccardo
Top achievements
Rank 1
answered on 02 Jul 2014, 08:57 AM
Thanks for your reply and sample!

The sample only calls on change when I select an already existing event. My requirement is that a user can simple select some slots in the scheduler and I save this selection.

regards,
Riccardo
0
Atanas Korchev
Telerik team
answered on 02 Jul 2014, 10:12 AM
Hi Riccardo,

The change event is fired when the user selects slots too. They are available in e.slots

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Riccardo
Top achievements
Rank 1
answered on 02 Jul 2014, 10:39 AM
Oh yes I see now. Selected 5 slots raise 5 events :-) Is there a way to detect when the user releases the mousebutton (dragend e.g.?). Because using the change event would cause multiple updates in the database and I only need to do that after the mouse was released.

regards
0
Atanas Korchev
Telerik team
answered on 02 Jul 2014, 11:18 AM
Hi,

There is no such event right now. Perhaps you can use the mouseup event in a way similar to using the click event in my second example.

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Riccardo
Top achievements
Rank 1
answered on 02 Jul 2014, 11:53 AM
$("#scheduler").on("mouseup", ".k-event", function(e) {
    alert('here mouseup!')
  });

this doesn't seem to work. Am I missing something?

thanks
0
Atanas Korchev
Telerik team
answered on 02 Jul 2014, 01:03 PM
Hi,

For the free slots you will need the following code:

  $("#scheduler").on("mouseup", ".k-scheduler-content td", function(e) {
      alert("up");
  });

Regards,
Atanas Korchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Riccardo
Top achievements
Rank 1
answered on 03 Jul 2014, 07:30 AM
Thanks, works like a charm now!

regards,
Riccardo
Tags
Scheduler
Asked by
Riccardo
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Riccardo
Top achievements
Rank 1
Share this question
or