CODEWITHSUNDEEP
jqueryjquery-ui-sortable
Chris
Chris

Reputation: 889

jQuery multiple Sortable lists on one page

I have a page that can have several different media galleries on one page. Each gallery thumb is 'sortable' in edit mode. This works find for the first one, but each additional gallery won't sort. I believe this is due to the fact that each sortable list is set to the container with class .dynamic_med_gallery so each additional sortable is trying to use that first div container with class .dynamic_med_gallery. How can I set each container to $(this) to keep each one separate and unique?

function sort_thumbs() {
   if (edit_mode == 'on') {
      var cont = $( ".dynamic_med_gallery" );
      cont.sortable({
         tolerance: 'pointer', 
         containment: cont, 
         items:'.dynamic_thumb',
         stop : function() {
            cont.addClass('update_index')
         }
      }).disableSelection();
   }
};

Upvotes: 0

Views: 2803

Answers (2)

Robert Waddell
Robert Waddell

Reputation: 854

This should do the trick for you. http://jsfiddle.net/qBzRC/27/

edit_mode = 'on';
if (edit_mode == 'on') {
    $(".dynamic_med_gallery").each(function () {
        $(this).sortable({
            tolerance: 'pointer',
            containment: $(this),
            items: '.dynamic_thumb',
            stop: function () {
                $(this).addClass('update_index'); // Not sure what this is for... might need changing depending on your needs.
            }
        }).disableSelection();
    });
}

Upvotes: 3

Chris
Chris

Reputation: 889

I put some more thought into it and worked it out as follows:

function sort_thumbs() {
    if (edit_mode == 'on') {
        $( ".dynamic_med_gallery" ).each(function() {
            cont = $(this);
            var this_id = cont.attr('id');

            cont.sortable({
                tolerance: 'pointer', 
                containment: cont, 
                items:'.dynamic_thumb',
                stop : function() {
                      $('#'+this_id).addClass('update_index');
                }
            }).disableSelection();
        });
    }
};

Upvotes: 1

Related Questions