Note that there are some explanatory texts on larger screens.

plurals
  1. POJquery-ui draggable and dynamic Jquery-ui draggable?
    text
    copied!<p>This is my code taken from <a href="http://jqueryui.com/demos/draggable/" rel="noreferrer">http://jqueryui.com/demos/draggable/</a></p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;jQuery UI Draggable - Default functionality&lt;/title&gt; &lt;link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"&gt; &lt;script src="../../jquery-1.6.2.js"&gt;&lt;/script&gt; &lt;script src="../../ui/jquery.ui.core.js"&gt;&lt;/script&gt; &lt;script src="../../ui/jquery.ui.widget.js"&gt;&lt;/script&gt; &lt;script src="../../ui/jquery.ui.mouse.js"&gt;&lt;/script&gt; &lt;script src="../../ui/jquery.ui.draggable.js"&gt;&lt;/script&gt; &lt;link rel="stylesheet" href="../demos.css"&gt; &lt;style&gt; .draggable { width: 150px; height: 150px; padding: 0.5em; } &lt;/style&gt; &lt;script&gt; $(function() { $( ".draggable" ).draggable(); $('.content').click(function(){ var htmlData='&lt;div class="draggable ui-widget-content ui-draggable"&gt;&lt;p&gt;Drag me around&lt;/p&gt;&lt;/div&gt;'; $('.demo').append(htmlData); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div class="demo"&gt; &lt;div class="draggable ui-widget-content"&gt; &lt;p&gt;Drag me around&lt;/p&gt; &lt;/div&gt; &lt;div class="content"&gt;Test &lt;/div&gt; &lt;/div&gt;&lt;!-- End demo --&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Iam making draggable component dynamically as you can see in function iam using append. But newly generated drggable object is not dragging although i have given the jquery-ui generated classes.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload