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

How to preventing moving without using e.preventDefault in the moveStart

3 Answers 112 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Grant
Top achievements
Rank 2
Veteran
Iron
Grant asked on 24 Jul 2018, 08:54 AM

Hi, 

So my title is probably a bit confusing. What I initially wanted was to not only prevent a user from resizing and deleting selective events in the but also prevent the event from appearing to be deletable when they arent. I've achieved this part successfully in a dojo (https://dojo.telerik.com/inEMEWeL) by removing the k-event-delete and k-resize-handle classes where needed. This would prevent the event from having the appearance that it can be moved and resized.

Once you've seen the dojo, I want to know, there are other classes and attributes within the event <div>, is there an attribute/element that I can alter to prevent moving of an event as well?

Thanks and kind regards, 
Grant

3 Answers, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 26 Jul 2018, 08:02 AM
Hi Grant,

In general, restricting an event from being moved, added, saved or resized could be achieved by handling the corresponding Scheduler events. In the respective event handlers, the desired events could be conditionally prevented through jQuery's preventDefault() method. A similar example could be observed on the following demo:


For the currently described scenario(limiting the event move behavior), you could use the Scheduler's moveStart event to achieve the desired result:
move: function(e) {
  var event = e.event;
  var isValid = false
 
  if (!isValid && !event.isAllDay) {
    e.preventDefault();
  }
}


Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Grant
Top achievements
Rank 2
Veteran
Iron
answered on 26 Jul 2018, 08:11 AM

Hi Dimitar,

Thanks for the quick response. I understand I can prevent movement using the scheduler events, however, I was wondering if there was a way to prevent an event from being moved, by altering the event <div> itself. For example, in my previous dojo, I removed the 'k-resize-handle' which in turn obviously prevent resizing. If there is no resize handle, there's no way to trigger a resizing.

I understand that this was a long shot, but was curious if it was possible. 
There's no need to respond if it's not possible.

Thanks and kind regards, 
Grant

0
Dimitar
Telerik team
answered on 26 Jul 2018, 09:48 AM
Hi Grant,

When the The Kendo UI Scheduler widget is initialized, it creates a single Draggable widget instance that is filtering through the different events when they are being dragged. Thus, it is not possible to restrict the move behavior for specific events in the dataBound event or by manipulating the DOM elements.

In case you would like to pursue this approach further, a possible suggestion could be to override the initialization of the Scheduler and provide a custom implementation that suits the project requirements. Additional help information on this topic could be found in the following section of the documentation

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Scheduler
Asked by
Grant
Top achievements
Rank 2
Veteran
Iron
Answers by
Dimitar
Telerik team
Grant
Top achievements
Rank 2
Veteran
Iron
Share this question
or