jQuery Sortable - moving elements between list with Double-Click

Question

I would like to add a functionality to the original jQuery Sortable Connect List example at: http://jqueryui.com/sortable/#connect-lists

Since my second list (#sortable2) is kind of large... I would like to be able to scroll the page down and once I found the item that I need to select/move... just Double.Click on it in order to move it to the other list.

I need to move the items (li) from #sortable2 to #sortable1 as well as from #sortable1 to #sortable2. The idea is just to Double-Click and not Dragging.

THANKS!

Answer 1

Your html

 <ul id="sortable1" class="sortable_list connectedSortable">
    <li class="ui-state-default">sortable1 Item 1</li>
    <li class="ui-state-default">sortable1 Item 2</li>
 </ul>
 <ul id="sortable2" class="sortable_list connectedSortable">
    <li class="ui-state-default">sortable2 Item 1</li>
    <li class="ui-state-default">sortable2 Item 2</li>
 </ul>

Only from id = sortable2 you will have the items appended to sortable1 with li.class = ui-state-default . This adds one li item at a time from sortable2 to sortable1 .

script

//attach on load
$(function() {
   $("#sortable2 .ui-state-default").dblclick(function(){        
     $("#sortable1").append(this);
   });
});

Answer 2

$(function() {
    $("ul li").dblclick(function(){             
            var parentID = $(this).parent().attr('id'); //sortable1 or sortable2
            if(parentID.match(/^(sortable1)$/g)) 
                $("#sortable2").append(this);                   
            else if(parentID.match(/^(sortable2)$/g))                
                $("#sortable1").append(this);               
    });
});