title: How to access the id of draggable element which is dropped into sortable
body: <p>I am using the JQuery libs to implement drag and drop.</p>
  
  <p>How do I get at the element that is being dragged when it is dropped into sortable list?</p>
  
  <p>I want to get the id of the div being dragged. The following element is dragged:</p>
  
  <pre><code>&lt;div class="control" id="control[1]" &gt;
    &lt;img src="img/controls/textfield.png" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have the standard dragging function from their example</p>
  
  <pre><code>$(".control").draggable({
    connectToSortable: '#sortable',
    helper: 'clone'
  });
  </code></pre>
  
  <p>function stop in dragging section with next code return proper value</p>
  
  <pre><code>stop: function(event, ui) {
    alert(ui.helper.attr('id'));
  }
  </code></pre>
  
  <p>And this is sortable element:</p>
  
  <pre><code>&lt;ul id="sortable"&gt;&lt;li&gt;test&lt;/li&gt;&lt;/ul&gt;
  </code></pre>
  
  <p>and his function:</p>
  
  <pre><code>$("#sortable").sortable({
    revert: true,
    accept: '.control',
    receive: function(event, ui) { 
      // here i need to get draggable element id
    }
  });
  </code></pre>
  
  <p>I have tried various ui.id etc which doesn't seem to work.</p>
  
  <pre><code>receive: function(event, ui) { 
    $(ui.draggable).attr("id")
  }
  </code></pre>
  
  <p>throws <code>undefined</code>.</p>
  
  <hr>
  
  <p><strong>Update</strong>:</p>
  
  <p>Sorry, my fault :) As my mother used to tell - "Read API before coding". <code>ui.item.attr('id')</code> works fine.</p>