title: jQuery: get <form> object to serialize from anonymous function argument
body: <p>I have a form within a <code>draggable()</code> div.  The form simply looks like this:</p>
  
  <pre><code>&lt;form id="add_interface" name="add_interface"&gt;
              USB  Type: 
  
                  &lt;select name="type-id"&gt;
                      &lt;option value="68"&gt;Micro-A&lt;/option&gt;
                  &lt;/select&gt;
                Use:
  
                  &lt;select name="use-id"&gt;
                      &lt;option value="13"&gt;Audio    &lt;/option&gt;
                  &lt;/select&gt;
  
  &lt;/form&gt;
  </code></pre>
  
  <p>When this is 'dropped' into a <code>droppable()</code> div I end up with this error:</p>
  
  <pre><code>XML filter is applied to non-XML value ({0:#1={}, length:1, context:#1#})
  </code></pre>
  
  <p>The jQuery for the droppable looks like this:</p>
  
  <pre><code> $("#droppable").droppable({
       drop: function(event, ui) {
           $(this).effect('highlight');
           alert(ui.draggable.("#add_interface").serialize());
       }
   });
  </code></pre>
  
  <p>I'm assuming I'm not accessing the form correctly, however if I try to simply do <code>ui.draggable.serialize()</code> I end up with an empty string.  Just wondering how I actually can serialize the form within the correct draggable div that is dropped.</p>
  
  <p>Thanks!</p>