Multiple groups #68

Closed
sylvaincaillot opened this Issue Feb 19, 2014 · 1 comment

Comments

Projects
None yet
2 participants
@sylvaincaillot

Hello,
I have 3 lists with items (A, B, C) and one empty one (D).
I would like to move items from A to D or B to D or C to D but not between A, B or C.
I tried playing with the group option, something as below but didn't work:
$("ol.A").sortable({
group: 'A'
})
$("ol.B").sortable({
group: B'
})
$("ol.C").sortable({
group: 'C'
})
$("ol.D").sortable({
group: ['A','B','C']
})

Your input on that would be very helpful.

Thanks a lot
Sylvain

@johnny

This comment has been minimized.

Show comment
Hide comment
@johnny

johnny Feb 19, 2014

Owner

You would have to overwrite isValidTarget

$item is the jQuery object, that currently is being dragged
container is the Container object (undocumented) of the list to check if you can drop your item there.

container.options is the options hash you pass into .sortable (+ some internal fields)

thus we get the following approach:

var currentDragID;
$("ol.A").sortable({
  group: "XXX",
  dragID: "A",
  onDragStart: function($item, container){
    currentDragID = container.options.dragID;
  },
  isValidTarget: function($item, container) {
    if(container.options.dragID == 'B' && currentDragID == 'A')
      return true;
    // additional rules
  }
});
$("ol.B").sortable({
  group: "XXX",
  dragID: "B"
});

let me know if this worked for you. This is an interesting example which I might add to the documentation.

The reason no documentation is available on the Container object is, that this might change pre 1.0. With the options hash I picked a relatively stable field. There is a container.el field, that contains the jQuery object for the list, but this name will definitely change.

Owner

johnny commented Feb 19, 2014

You would have to overwrite isValidTarget

$item is the jQuery object, that currently is being dragged
container is the Container object (undocumented) of the list to check if you can drop your item there.

container.options is the options hash you pass into .sortable (+ some internal fields)

thus we get the following approach:

var currentDragID;
$("ol.A").sortable({
  group: "XXX",
  dragID: "A",
  onDragStart: function($item, container){
    currentDragID = container.options.dragID;
  },
  isValidTarget: function($item, container) {
    if(container.options.dragID == 'B' && currentDragID == 'A')
      return true;
    // additional rules
  }
});
$("ol.B").sortable({
  group: "XXX",
  dragID: "B"
});

let me know if this worked for you. This is an interesting example which I might add to the documentation.

The reason no documentation is available on the Container object is, that this might change pre 1.0. With the options hash I picked a relatively stable field. There is a container.el field, that contains the jQuery object for the list, but this name will definitely change.

@johnny johnny closed this Apr 19, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment