title: Connecting jQuery UI dialogs with a line using JsPlumb
body: <p>I am using jQuery plugin called jsPlumb - <a href="http://jsplumb.org/jquery/demo.html" rel="nofollow noreferrer">http://jsplumb.org/jquery/demo.html</a> and I want to connect my jQuery UI Dialogs with lines generated by jsPlumb. But I cant figure out way to do it. </p>
  
  <p>I have this source:</p>
  
  <pre><code>&lt;div id="okenko1"&gt;Tuhle neco je&lt;/div&gt;
  &lt;div id="okenko2"&gt;Tuhle je neco jineho&lt;/div&gt;
  </code></pre>
  
  <p>When I create dialog from this divs with jQuery UI</p>
  
  <pre><code>$("#okenko1").dialog()...
  </code></pre>
  
  <p>And then I do plumb:</p>
  
  <pre><code>jsPlumb.connect({source: $("#okenko1"), target: $("#okenko2")});
  </code></pre>
  
  <p>Its bugged :-D Looks like this <a href="http://prntscr.com/2udde" rel="nofollow noreferrer">http://prntscr.com/2udde</a></p>
  
  <p>I tried to reverse the process, first plumb em and then use dialog, result is here <a href="http://prntscr.com/2udef" rel="nofollow noreferrer">http://prntscr.com/2udef</a>:</p>
  
  <p><img src="https://i.stack.imgur.com/4T5yu.png" alt="enter image description here"></p>
  
  <p>Next I tried to plumb divs created by UI, it isnt working...</p>
  
  <p>What can I do next? I really need to connect two elements on page with line, that will move when I move one of the elements, but I cant find anything better than jsPlumb.</p>