jQuery draggable / droppable issue -
i've been trying implement simple draggable / droppable code (link below) no success. items drag, revert , stay in containment. however, when dropped in droppable area item gives alert, should, no longer draggable.
ideally, have item draggable between drag , drop areas. in case user moves droppable area , changes mind. once in droppable area, allow item movable in there.
am overlooking obvious? found searching looked pretty basic , straightforward implement.
i've been searching , trying few things, haven't had luck.
<div class="build_board_text" id="build_board_text"> <div id="src_landscape_8-5x11"> <div id="draggable_1" class="draggable_item"> <br />text 1. </div> <div id="draggable_2" class="draggable_item"> <br />text 2. </div> </div><!-- source list --> <div id="dst_landscape_8-5x11"> </div><!-- destination list --> </div $(function() { $('div', $('#src_landscape_8-5x11')).draggable({ revert: 'invalid', containment: '#build_board_text' }); $('#dst_landscape_8-5x11').droppable({ accept: '#src_landscape_8-5x11 > div', drop: function() { alert('dropped!'); } }); $('#src_landscape_8-5x11').droppable({ accept: '#dst_landscape_8-5x11 div', drop: function() { alert('dropped back!'); } }); });
not entirely sure why, if remove position:relative
#dst_landscape_8-5x11
works.
edit: also, change source on 2nd 1 match first:
$('#src_landscape_8-5x11').droppable({ accept: '#src_landscape_8-5x11 div',...
the items originate in src_...
considered part of seems.
Comments
Post a Comment