I have now tested quite a few things, and I understand it's not optimal, but I need drag and drop from main page to an iframe. Both are on the same domain.
I have tested with iframeFix, but either it's not supported in my browser (Chrome) or I do something wrong.
http://api.jqueryui.com/draggable/#option-iframeFix
<div id="mycontainer" class="mycontainer">
<iframe id="iframewindow" src="./child.html" frameborder="0" width="100%" height="100%"></iframe>
</div>
in the iframe:
<div id="sortable">
<div class="portlet">
some content
</div>
</div>
(I use jQuery UI inside the iframe for sortable.)
The script for loading draggable inside the main page:
$(function() {
$( ".draggable" ).draggable({
connectToSortable: "#sortable",
helper: "clone",
iframeFix: true,
helper: function(event) {
return "<div class='custom-helper'>I move this</div>";
},
revert: "invalid",
});
$().disableSelection();
)};
I have tested with making overlays etc, but somehow I haven't got it to work.
Is it a way that makes drag and drop from a html page to an iframe work? (In all browsers?)
I do not need jQuery UI draggable if another solution works well.