CODEWITHSUNDEEP
javascriptjqueryjquery-uiiframedrag-and-drop
Yogen
Yogen

Reputation: 53

How to apply drag and drop in iframe from outside HTML?

Assume that I have following HTML file:

** main.html **

<html>
<body>
<ul>
<li>Element to drag</li>
</ul>

<iframe src="demo.html">
</iframe>
</body>
</html>

demo.html (iframe code)

<body class="iframe">

</body>

I'm using jquery UI for drag and drop (Link) And assume that all javascript files are included in main.html and demo.html

Any help would be great helpful !!! Thanks

Upvotes: 3

Views: 2197

Answers (1)

Jose Faeti
Jose Faeti

Reputation: 12302

I had the same problem and manage to do it this way.

Consider the draggable element in your main file normally and refer to the iframe droppable elements with

$( 'your-iframe' ).contents().find( 'elments-you-want-droppable' ).droppable({

    // droppable settings here as normal

});

Upvotes: 1

Related Questions