1

jQuery UI Sortable is not working when using Masonry. Any idea how to avoid this conflict? Any help would be appreciated.

Yi Jiang
  • 49,435
  • 16
  • 136
  • 136
user558134
  • 1,071
  • 6
  • 25
  • 38

3 Answers3

1

Use gridster — it works like a charm and very intuitive

enter image description here

Vladimir Starkov
  • 19,264
  • 8
  • 60
  • 114
  • The only problem with gridster is as far as I know it just changes the order visually. If you are looking to have it rearrange the items in the DOM you would want to use Sortable and Masonry. – Cpage Dec 07 '12 at 21:17
1

I think i had a similar problem.

I managed to fix it by simply recalling masonry within the code for setting up the sortable elements. (there might be a better way, i'm not sure?)

$(function() {
        $("#youritem").sortable({ opacity: 0.9, cursor: 'move', update: function() {
            var order = $(this).sortable("serialize") + '&action=updateRecordsListings'; 
            $.post("dosomething.php", order, function(theResponse){
                       //you can see that i've re-called masonry once the sortable object has been moved                
                        $('#youritem').masonry({columnWidth: 200, itemSelector: 'youritem' });
            });                                                              
        }                                 
        });
    });

Hopefully that helps you out – if there is another way i'd also like to know.

leeboyce
  • 51
  • 1
  • 6
1

I also had similar problem, but then i found a working Masonry&Sortable&resizable example:

http://tyler-designs.com/masonry-ui/

Not perfect, but it's a good starting point.

hege
  • 11
  • 1