JQuery UI: combining selects with Draggable

Question

I have a big problem trying to figure out how the selectable () and draggable () components of jqueryUI work together .

They work great on their own. I am trying to create an interface such as a file browser so that users can select multiple files or drag and drop INDIVIDUAL files to other inaccessible places in the application. I know that many people are considering ways to drag and drop multiple files, but this is currently not a requirement for me.

In the example that you can select, you can use it if you use a mouse, but it no longer works for simple mouse clicks or crl to select several (when dragging and dropping on).

EXAMPLE HERE: http://jsbin.com/aguju4/3/edit

Answer 1

It was decided to cancel the selected plug-in and independently create the base version. Both don't seem to be doing very well. I based my own selectable solution for live clicks () so that it does not contradict the events of dragged clicks.

Answer 2

You could simply use the mousedown event to manually make the selected items.

var mouseDownCallback = function(e) {

    if (e.ctrlKey==0) $('#your-container').children().removeClass('ui-selected');

    $(this).addClass('ui-selected');

}
$('#your-container').on('mousedown','.item', mouseDownCallback);