title: Jquery File Upload Hidden IFrame
body: <p>I needed a quick explanation on how to get an AJAX style file upload going using a hidden iframe. Here's the portion of the HTML code pertaining to the form:</p>
  
  <pre><code>&lt;div id = "file" class = "info"&gt;        
      &lt;form id="file_upload_form" method="post" enctype="multipart/form-data" action='script/uploadScript'&gt;
          &lt;input name="file" id="file" size="27" type="file" /&gt;&lt;br /&gt;
          &lt;input id = "uploadSubmit" type="submit" name="action" value="Upload" /&gt;
          &lt;iframe id="upload_target" name="upload_target" src="" style="width:0;height:0;border:0px solid #fff;"&gt;&lt;/iframe&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's the relevant PHP:</p>
  
  <pre><code>public function uploadScript(){
  
      $returnVals = array();
  
      if ($_FILES["file"]["error"] &gt; 0){
          $returnVals['error'] =  "Error: " . $_FILES["file"]["error"] . "&lt;br /&gt;";
      }else{
          if ($_FILES["file"]["type"] != "text/plain"){
              $returnVals['error'] = "Badtype";
          }else{
              $returnVals['text'] =  file_get_contents($_FILES["file"]["tmp_name"]);
          }
      }
  
      echo json_encode($returnVals);
  }
  </code></pre>
  
  <p>So, essentially, the PHP gets the file and checks if it's a text file. Then, I want to access the returned json within javascript. That's where I get confused...</p>
  
  <pre><code>$("#file_upload_form").submit(function() {
      $("#file_upload_form").target = "upload_target";
      $("#upload_target").onload = uploadDone();
  
  });
  </code></pre>
  
  <p>Ideally, when the upload is complete and the iframe is loaded, this should call</p>
  
  <pre><code>function uploadDone() {
      alert($("#upload_target").contents().find("body").text());  
  }
  </code></pre>
  
  <p>But, that's always blank. Essentially, the returnVals are placed into the iframe body, but after the alert, so the alert has nothing in it. So, is there a way to remedy this little flaw? </p>
  
  <p>Is there any better explanation on how to do this? I've been banging my head against it with different sample codes and etc all day with no luck :/ </p>
  
  <p>I essentially want to be able to alert the text returned via the php code. Btw, I'm doing it this way because I want it to be able to work on IE7 and all browsers after. </p>
  
  <p>I'd appreciate any help a ton. Thanks for the time!</p>