I’m having trouble with the droppable effect in jquery 1.3.1 (UI version 1.5.3). As far as I can tell, everything works perfectly except the drop() function doesn’t get called. I can tell the droppable target is accepting the element being dragged (via the thumbnail class), but the draggable item won’t drop. Thanks for your help in advance!
<html> <head> <script type='text/javascript' language='javascript' src='/jquery/jquery.js'></script> <script type='text/javascript' language='javascript' src='/jquery/jquery.ui.js'></script> <script type='text/javascript' language='javascript'> //<!-- $(document).ready(function() { $('.drop_box').droppable({ accept: '.thumbnail', activeClass: 'droppable-active', hoverClass: 'droppable-hover', drop: function (ev, ui) { alert('Dropped!'); } }); $('#sample_thumbnail').draggable({ helper: 'clone' }); }); //--> </script> <style type='text/css'> .drop_box { top:16px; width:250px; height:250px; border:1px solid #000000; float: right; } .droppable-hover { background-color: #eeeeee; border: 1px solid red; } .droppable-active { background-color: orange; color: white; border: 1px solid blue; } .thumbnail { width:100px; height:100px; border:1px solid green; } </style> </head> <body> <div class='drop_box'>droppable</div> <div id='sample_thumbnail' class='thumbnail'>draggable</div> </body> </html>
‘jquery 1.3.1 (UI version 1.5.3)’
You should not be using this pair of versions. JQuery 1.3.x is not compatible with the UI 1.5.x series, and requires the 1.6 release candidates. The release candidate versions are quite stable if you just want the drag and drop functionality; I wouldn’t be concerned at all for using them in production. I only use drag and drop, so I can’t comment on the stability of the rest of the 1.6 branch of UI.