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

4 posts, 0 answers
  1. Grant
    Grant avatar
    167 posts
    Member since:
    Jul 2016

    Posted 24 Jul 2018 Link to this post

    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 scheduler, 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

  2. Dimitar
    Admin
    Dimitar avatar
    806 posts

    Posted 26 Jul 2018 Link to this post

    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.
  3. Grant
    Grant avatar
    167 posts
    Member since:
    Jul 2016

    Posted 26 Jul 2018 in reply to Dimitar Link to this post

    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

  4. Dimitar
    Admin
    Dimitar avatar
    806 posts

    Posted 26 Jul 2018 Link to this post

    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.
Back to Top