a dragging bug

[kyleada]

Hello, when I drag the widgets, sometimes it happens one widget stack on top of the other when they stop. I check the elements, found the style marginTop is changing fast and continuously.

how can I deal with it? Thank you

[andrey-skl]

I have found a scenario to 100% reproduce it.

1. Make small widget on left top corner.
2. Place bigger widget just under it.
3. Drag big widget to top of small widget.
4. Overlay happened.

[andrey-skl]

Temporary workaround:

          draggable: {
            handle: '.drag-handler', // optional selector for resize handle
            stop: function () {
              //TODO: remove after https://github.com/ManifestWebDesign/angular-gridster/issues/283 will be fixed
              var GridsterCtrl = $element.find('*[gridster]').controller('gridster');
              var gridsterItems = $element.find('*[gridster-item]');
              gridsterItems.each(function (indes, node) {
                var ctrl = angular.element(node).controller('gridsterItem');
                GridsterCtrl.moveOverlappingItems(ctrl);
              });
            }
          }

[prochafilho]

I could not get this to work using the temporary workaround...

[andrey-skl]

@prochafilho Maybe you have some different grid markup or something. Did you debug it to be sure that everything in code works? What version did you use? I used 0.13.2

[prochafilho]

Oh I see.. Im on 0.11.7; I tried to switch to 0.13.2 but broke my entire layout

[andrey-skl]

@prochafilho anyway, you can find another code to handle that issue in same way.

[prochafilho]

Alright. Thank you though.

[prochafilho]

Hey, could you describe how this fixed this behavior? I'm running the latest gridster version and i still couldn't get this to work. I'm more curious than anything. Thank you.

[andrey-skl]

@prochafilho after drag finish it performs rearranging overlapped items by executing moveOverlappingItems method for each gridsterItem directive

[ermakovich]

@huston007 I suppose this workaround fixes issue only partially. While dragging you will still see ovelapped items.

[andrey-skl]

@ermakovich right. But something is better than nothing)

[danomatic]

I'm not able to reproduce this. In the demo I created a width 2 item under a width 1 item and resized/dragged the larger item over the item with width 1 and they repositioned correctly.

[okonet]

@huston007 :+1: for the workaround.

[danomatic]

Is this still an issue in the latest release? I cannot reproduce it.

[ThiagoGF]

The bug still exists in the latest release, it happens in any case, but is much easier to reproduce with full grids and gridster itens with "heavier" content.

[Karillion]

I made a plunkr which you can use to reproduce this: https://plnkr.co/edit/zI2e8f?p=preview

Reproduction steps:

1. Move "Widget 1" below "Widget 2
2. Make "Widget 1" larger than "Widget 2"
3. Move "Widget 1" on top of "Widget 2"

[nerdni]

Maybe you have any updates on this? I am also facing the same issue, workaround does not work.