Issue while adding row reordering in kendoTreeList using Sortable

5 posts, 0 answers
  1. Samir
    Samir avatar
    2 posts
    Member since:
    Jan 2015

    Posted 30 Jan 2015 Link to this post

    I am trying to add row reordering functionality inkendoTreeList using kendoSortable using following code.

                    var grid =$('#scorecardTreeList').kendoTreeList({
                        dataSource: treedataSource,
                        columns: [
                            { field: "strategicName", title: "Strategic Name" },
                            { field: "Type", title: "Type" },
                            { field: "Name", title: "Name" }
                        ],
                        selectable: true,
                        expanded: true
                    }).data("kendoTreeList");

                    $($('#scorecardTreeList table')[1]).kendoSortable({
                        filter: ">tbody >tr",
                        hint: $.noop,
                        cursor: "move",
                        placeholder: function(element) {
                            return element.clone().addClass("k-state-hover").css("opacity", 0.65);
                        },
                        container: "#scorecardTreeList tbody",
                        change: function(e) {
                            var skip =0,
                                oldIndex = e.oldIndex + skip,
                                newIndex = e.newIndex + skip,
                                data = treedataSource.data(),
                                dataItem = treedataSource.getByUid(e.item.data("uid"));
                            grid.dataSource.remove(dataItem);
                            grid.dataSource.insert(newIndex, dataItem);
                        }
                    });

    I am facing issue that the row next to desired row (which i want to move) appears below dragged row after reordering.
    e.g if I have following rows
    Tiger
    Apple
    Meow
    Orange
    ABC1

    when I move Tiger below Orange the new order appears as 

    Meow
    Orange
    Tiger
    Apple
    ABC1 which is unexpected.

    Please help.

  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 03 Feb 2015 Link to this post

    Hi Samir,

    I am afraid that the scenario you would like to achieve is not supported out of the box. The Sortable widget will allow you to visually reorder the TreeList rows but updating the data in the TreeList DataSource will require a lot of additional logic. Current implementations fails because the Sortable's change event handler is not suitable for reordering items in a TreeList. It is suitable for reordering items in a DataSource with local data.

    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. James
    James avatar
    5 posts
    Member since:
    Jan 2016

    Posted 2 days and 19 hours ago in reply to Alexander Valchev Link to this post

    So how exactly would one have the TreeList control do reordering and level changes like is possible with the TreeView?
  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2877 posts

    Posted 1 day and 1 hour ago Link to this post

    Hello James,

    Please check this demo.

    Regards,
    Alexander Valchev
    Telerik by Progress
    Kendo UI is ready for Visual Studio 2017 RC! Learn more.
  6. James
    James avatar
    5 posts
    Member since:
    Jan 2016

    Posted 22 hours ago in reply to Alexander Valchev Link to this post

    That demo doesn't allow reorder, only re-parent.
Back to Top
Kendo UI is VS 2017 Ready