Turn Kendo grid into draggable Item

5 posts, 0 answers
  1. Coty
    Coty avatar
    41 posts
    Member since:
    Jun 2014

    Posted 05 Mar Link to this post

    Can I make a kendo grid a draggable item?  What I would like to do for example is have 2 or more grids on a page and the user can click the header of the grid and move them around to different drop zones on the page.  Like a customized widget dashboard.

    Is this possible?

    Thanks,

    Coty

  2. Coty
    Coty avatar
    41 posts
    Member since:
    Jun 2014

    Posted 05 Mar in reply to Coty Link to this post

    It looks like I could just hide the grid header and place it into a draggable container and put some padding at the top of the container to simulate the grid header, but it's really just a handle for the draggable item?  Let me know if there is a better approach.

    Thanks.

  3. Kendo UI is VS 2017 Ready
  4. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 09 Mar Link to this post

    Hello Coty,

    I would not recommend this because changing the place of the Grid requires DOM manipulations with the Grid wrapper element. The widget is not intended to be moved hence it is not tested in such scenarios.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. Coty
    Coty avatar
    41 posts
    Member since:
    Jun 2014

    Posted 09 Mar in reply to Alexander Valchev Link to this post

    Ok - just to make sure I am understanding, this wouldn't work?  (I'm not at a place I can test currently)

    <div class="draggable-item">
       <div class="DragHandle></div>
        <div id="grid"></div>
    </div>

    Where draggable item gets initialized as a kendo draggable item with a handle of DragHandle, and grid get's initiliazed as a kendo grid.

    If this does work, would  you initialize the grid first then the draggable item or vice versa?  If it doesn't work it should! :)

         

  6. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 11 Mar Link to this post

    Hi Coty,

    I am not saying that this will not work, but that you might experience issues depending on the combination of Grid features that are turned on. For example I would not recommend this if you plan to use virtual scroller.

    Here is a very simple example that works:


    Regards,
    Alexander Valchev
    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