title: Opening fancybox on an iframe from form post
body: <p>I have a form(its just a form in a simulator html for a ecommerce cart since I don't have the cart implemented yet. Its just to type the SKU, name, price, quantity, etc. and post to the checkout screen) and I want to when I click on a button the page posts it's information to a fancybox and I can navigate in it.</p>
  
  <p>So far I managed to make the post be received by the fancybox first page of the checkout(login screen) using Garland's post on this <a href="https://stackoverflow.com/questions/969522/open-fancybox-or-equiv-from-form-input-type-submit" title="question">question</a>, but whenever I continue with the flow, logging into the system, it opens on the main window.</p>
  
  <p>The problem I am having is that I can't seem to make fancybox open on an iframe, therefore I lose control after login, closing the fancybox.</p>
  
  <p>my partial html:</p>
  
  <pre><code>&lt;form target="Popup" action="../Account/LogOn" method="post" name="form1" id="form1"&gt; 
      &lt;div style="float: left; width: 500px; left: 50%; top: 20px; margin-left: -250px; position: absolute;"&gt;
          &lt;div style="float: left; width: 100%; height: auto; margin-top:20px; text-align:center"&gt;
              .
              .
              .
              &lt;input type="button" value="regular purchase" onclick="javascript: SendForm();" style="width:150px; height:30px; font-family: Trebuchet MS, Verdana, Helvetica, Sans-Serif; font-size: 10pt; vertical-align: middle" /&gt; 
              &lt;input type="submit" value="lightbox purchase" style="width:180px; height:30px; font-family: Trebuchet MS, Verdana, Helvetica, Sans-Serif; font-size: 10pt; vertical-align: middle" /&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>my code:</p>
  
  <pre><code>$("#form1").ajaxForm({
          success: function (responseText) {
              $.fancybox({
                  type: 'iframe',
                  content: responseText,
                  fitToView: false,
                  width: '70%',
                  height: '70%',
                  autoSize: true,
                  closeClick: false,
                  openEffect: 'elastic',
                  closeEffect: 'fade',
                  helpers: { overlay: { css: { 'background': 'rgba(0, 0, 0, 0.65)' } } },
                  afterClose: function () {
                      location.reload();
                      return;
                  }
              });
          }
      });
  </code></pre>
  
  <p>This code opens a fancybox with the login page and all, but not inside an iframe, just plain divs. Anyone has an idea to work around this issue?</p>
  
  <p>Unfortunately I don't have a link to show it to you guys since i'm still on an early stage development, and it's all localhost so far.</p>