title: Close jQuery UI Dialog from Iframe
body: <p>I've implemented the following code for uploading photos inside a jQuery dialog (using an iframe).</p>
  
  <p><strong>Here's the Iframe</strong></p>
  
  <pre><code>&lt;div style="display: none"&gt;
      &lt;iframe id="upload-form" frameborder="0" marginheight="0" marginwidth="0" src="Upload.aspx"&gt;&lt;/iframe&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>And here's the jQuery code</strong> on the parent page which takes care of opening the dialog.</p>
  
  <pre><code>$("#upload-image").click(function (e) {
      e.preventDefault();
      $('#upload-form').dialog({
          modal: true,
          width: 300,
          title: "Upload Image",
          autoOpen: true,
          close: function(event, ui) { $(this).dialog('close') }
      });
  });
  </code></pre>
  
  <p>I'm then injecting a script (on the iframe page) after the upload is successful which passes a result back to the parent page, but I want to close the dialog at the same time.</p>
  
  <pre><code>$(document).ready(function () {
      $(parent.document).find('#imagePathValue').val('theimagevalue');
      $(parent.document).find('#upload-form').dialog('close');
  });
  </code></pre>
  
  <p>The <code>#imagePathValue</code> is passed successfuly, but I can't seem to be able to close the dialog.</p>
  
  <p><strong>Any ideas?</strong></p>