0

I have both jQuery Sortable and jQuery Masonry working. When i combine the two sortable doesn't want to work correctly.

As i drag an item the other items do not move however the backend (Rails) does work because is saves the position when i refresh the page even though it didn't show that it moved. So the front end is the problem.

If i drag object 1 to the last position none of the other objects will move on the screen it is like they are stuck in place. I am pretty sure i need to do something so Masonry is refreshing as i drag the object.

Here is my code in Coffeescript

jQuery -> 
    $('.listwrap').sortable
     update: ->
       $.post($(this).data('update-list'), $(this).sortable('serialize'))

$(document).ready ->
  $('#container').masonry
    itemSelector: '.list'
    columnWidth: 200
return

I have tried these but i can't seem to get it to work.

jQuery Masonry conflict with jQuery UI Sortable

jQuery Masonry and UI Sortable

Community
  • 1
  • 1
EliteViper7777
  • 187
  • 1
  • 12
  • You could use masonry creator's other library [packery, which includes draggable functions](http://packery.metafizzy.co/draggable.html). – Macsupport Aug 16 '15 at 22:15
  • Packery supports jQuery Draggable but not jQuery Sortable. I need something for jQuery Sortable. – EliteViper7777 Aug 16 '15 at 22:22

1 Answers1

0

using following code in update does the trick:

grid.masonry('reloadItems');
grid.masonry('layout');

where grid is a masonry jquery object.

Azmi Ahmad
  • 1