Je fais beaucoup d'efforts pour que cela fonctionne! J'ai une liste d'images dans un div que je fais glisser. J'ai aussi une boîte de dialogue qui est déclenchée (ouverte) quand le glissement commence. Pour une raison quelconque, je ne peux pas tomber dans cette boîte de dialogue. Je peux laisser tomber partout ailleurs sur la page sauf dans un dialogue. voici mon code:faites glisser et déposez dans un dialogue
$(document).ready(function(){
// Executed once all the page elements are loaded
//setup new person dialog
// Change overlay color and opacity
$('#sample').dialog({
//dialog options
autoOpen: false,
draggable: false,
modal: false,
show: 'explode',
closeOnEscape: true,
position: 'top',
minHeight: '400',
minWidth: '600',
width: 750,
title: "Some title",
open: function(type, data) {
$(this).parent().appendTo("form");
}
});
$(".random-img").draggable(
{
cursor: "move",
helper: "clone",
opacity: "0.5",
zIndex: "2700",
containment: "document",
handle: ".random-img", // makes toolbar the dragable part
drag: function(ev, ui) {
$('#sample').dialog("open");
}
}
);
$("#sample").droppable(
{
accept: ".random-img",
tolerance: "touch",
drop: function(ev, ui)
{
var droppedItem = ui.draggable.clone().addClass('sclass');
$(this).append(droppedItem);
}
}
);
});
</script>
<html>
<head> Page test </head>
<body>
<div class="random-img">
<img src="images/someimage.jpg" />
</div>
<div id='sample'>
</div>
</body>
</html>
Toute aide ou aperçu sera grandement appréciée.
Merci
son '$ (ui.draggable) .clone(). AddClass ('sclass')' – czarchaic
merci czarchaic, j'ai ajouté ce que vous avez mentionné, il ne fonctionne toujours pas. Une chose que j'ai vu quand je jouais avec les options de la boîte de dialogue est que lorsque je définis autoOpen: true, cela fonctionne parfaitement! Je ne veux pas qu'il s'ouvre quand la page est chargée cependant. – paravamu