How to connect draggable with sortable.

6 posts, 0 answers
  1. Vinay
    Vinay avatar
    3 posts
    Member since:
    Jul 2012

    Posted 12 Sep 2014 Link to this post

    Hi ,

    I need to implement a functionality where an item dragged from treeview should be  dropable in to a sortable list .

    There can be many sortable lists and the source of draggable item can be list or static elements on the page.

    When i checked connectWith option in sortable, it didnt work.

    is there any other configuration needed?

    pls help me resolve this.

    Thanks,
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 15 Sep 2014 Link to this post

    Hello Vinay,

    If I understood correctly you would like to connect a Sortable widget with a TreeView that has drag n drop functionality enabled.
    This case is not currently supported as the TreeView has its own drag n drop functionality. In case you would like to implement the scenario please consider using the Drag and Drop components instead of the Sortable widget.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Vinay
    Vinay avatar
    3 posts
    Member since:
    Jul 2012

    Posted 16 Sep 2014 in reply to Alexander Valchev Link to this post

    Hi Alexander,

    I think the scenario cannot be implemented with only Drag and Drop components.
    Actual scenario is demonstrated in the below link which is implemented using Angular Js and Jquery.
    http://jsbin.com/jirew/1/

    In the above scenario the expressions on the left are dynamic. pls have a look at the datasource structure for detailed understanding.

    Thanks,
    Mahesh Gupta
  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 16 Sep 2014 Link to this post

    Hello Vinay,

    The closest possible scenario is to allow the user to add items from the TreeView to the Sortable widget and to sort them after that. This approach is used internally by the Pivot Grid:
    In such case you should not use the connectWith option. Instead use the TreeView API and events to remove item from the TreeView and add it to the Sortable container.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Vinay
    Vinay avatar
    3 posts
    Member since:
    Jul 2012

    Posted 17 Sep 2014 in reply to Alexander Valchev Link to this post

    Hi Alexander,

    Thanks for the reply.

    The work around you suggested will work but greatly effects the usability.
     Can I raise it as a feature request or can this be expected in  near future release?

    Thanks,
  7. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 19 Sep 2014 Link to this post

    Hello Vinay,

    Such kind of integration will mean that the widgets should be aware of each other which is not a good practice.
    I am afraid that at present the only supported scenario is the one when the user drags an item from the TreeView and appends it to the Sortable container with the first drop action. After that the user will be able to sort the item within the Sortable container.

    Directly sorting the item (without first appending it to the container) is not supported out of the box and will require a lot of additional JavaScript logic that will handle the placeholder visualization. I am afraid that at present we do not have plans to offer such build-in functionality as it is not a generic case but a project specific requirement.

    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