More issues with Kendo UI drag and drop

5 posts, 0 answers
  1. Jack
    Jack avatar
    100 posts
    Member since:
    Jan 2007

    Posted 12 Jan 2015 Link to this post

    Following http://www.telerik.com/forums/miscellaneous-issues-with-kendo-ui-drag-and-drop, I have tried doing it a different way (although I have yet no idea how I will implement resize en rotate using this track).

    See Telerik dojo at http://dojo.telerik.com/Oqipe.

    This dojo solves the issues in my previous thread but introduces 2 new issues:
    1. When dropping the orange square, it shifts about 5px right and bottom. Any idea why since I copy the position of the hint?
    2. When dropping the orange square close to any edge of the container, it reverts to its original position. Again, any idea why and how to sort it out?
    Thx.
  2. Jack
    Jack avatar
    100 posts
    Member since:
    Jan 2007

    Posted 12 Jan 2015 in reply to Jack Link to this post

    As far as using drag and drop on a resize and a rotate handle, using the hint seems to be a dead end. The hint seems really designed for moving elements.
  3. Kendo UI is VS 2017 Ready
  4. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 14 Jan 2015 Link to this post

    Hello Jacques,

    I am not sure that I completely understand the remark about the resize and rotate handle, but I may suggest that you examine the internal implementation of (for example) the window resizing or the diagram rotation tools in the Kendo UI source code. Perhaps this will give you some clues. 

    Back to your questions, you can avoid the shift by fixing the html, body margins and paddings - check an updated version of your example. The other issue you describe is due to the drop outside of the container - instead of using drop target drop event (which is not triggered), you may use the dragend event. 

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Jack
    Jack avatar
    100 posts
    Member since:
    Jan 2007

    Posted 14 Jan 2015 in reply to Petyo Link to this post

    To understand the remark about the resize and rotate handles, please consider what I am trying to achieve at http://dojo.telerik.com/ecUWE.

    The issue I have is "should I use the hint?" and although it is clear how to use it when translating an element, it is not clear how to use it when resizing and rotating, especially to ensure the element remains within the boundaries of a container.

    As far as the examples you mention are concerned:
    1. diagram rotation tools (kendo.dataviz.diagram.js) seem programmatic and apparently do not use drag and drop or Draggable. See also http://demos.telerik.com/kendo-ui/diagram/index. So there is not much to learn here except formulas for rotating.
    2. window resizing, besides not implementing rotation, does not use the hint. See kendo.window.js line 1237:

    that._draggable = new Draggable(wnd.wrapper, {
    filter: ">" + KWINDOWRESIZEHANDLES,
    group: wnd.wrapper.id + "-resizing",
    dragstart: proxy(that.dragstart, that),
    drag: proxy(that.drag, that),
    dragend: proxy(that.dragend, that)
    });

    My impression is that the hint cannot be used when resizing and rotating. In this case, you are very much on your own. Please confirm.


  6. Petyo
    Admin
    Petyo avatar
    2438 posts

    Posted 16 Jan 2015 Link to this post

    Hello Jacques,

    Of course, using the hint is a matter of personal preference. In case you find its behavior too restrictive or unsuitable for your purposes, you can implement the necessary behavior without it.  

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready