Grid Row Reordering issue

[Atul]

Hi 

I am working on reordering row using drag and drop functionality for that I have implemented the code from the jsFiddle (http://jsfiddle.net/UsCFK/) successfully but it seem work like swapping between two rows.

My requirement is different if user drop any specific row it should be place on that location and other location gets modified accordingly for example I have 6 rows,
1
2
3
4
5
6

dragged  2nd row and drop on between 5th and 6th row, now order become
1
3
4
5
2
6 
Right now this is not working as per jsFiddle library.

There is a way to do this?

Thanks-
Atul K.
-------------------------------------------
Build Relationship Dynamically 

[Atanas Korchev]

Hi,

You could check the integration with the Kendo Sortable widget demo.

Regards,
Atanas Korchev
Telerik

 

 

[Atul]

Thanks Atanas for your reply.

Right now I am fetching one issue while reordering the rows in grid the scroll bar is not moving.  
If I move the selected row down or up, its moving but the scroll bar is not moving parallel and I am unable to reorder selected row in scrolling area.

I need to do any specific setting to work reordering with scrolling?

Thanks-
Atul K.

[Alexander Valchev]

Hello Atul,

Currently the Sortable widget does not support automatic scrolling. If you want you may cast a vote for this feature request at Kendo UI Feedback portal using this link.
The more votes it collects the higher priority it will have when we build the next road map.

Regards,
Alexander Valchev
Telerik

 

 

[nicolaken]

Dear Alexander,

the link above says that the feature is completed in Q2 2015 but I'm using the 2018.2.620 and if the row sorting features is implemented with the grid set as scrollable the grid scrollbar is not working and you can not move the row outside the actual grid rows view.

Is there any workaround?

Marco

 

[nicolaken]

Dear Alexander,

I found the solution. I was missing the autoscroll property in kendoSortable.

gridrows.table.kendoSortable({
            hint: hintElement,                        
            cursor: "move",
            autoScroll: true, <-- this one missing!!!
            placeholder: function(element) {
                return element.clone().addClass("k-state-hover").css("opacity", 0.65);
            },
            container: "#gridrows tbody",
            filter: ">tbody >tr",             
            change: function(e) {
                 .... 
            }
        });