Retrieving HTTP status code from loaded iframe with Javascript

Question

I used the jQuery Form plugin for asynchronous form submission. For forms that contain files, it copies the form to a hidden iframe, submits it, and copies back the iframe's contents. The problem is that I can't figure out how to find what HTTP status code was returned by the server. For example, if the server returns 404, the data from the iframe will be copied as normal and treated as a regular response.

I've tried poking around in the iframe objects looking for some sort of status_code attribute, but haven't been able to find anything like that.

---

The $.ajax() function can't be used, because it does not support uploading files. The only way to asynchronously upload files that I know of is using the hidden iframe method.

Answer 1

You can't get page headers by JS, but you can distinguish error from success: Try something like this:

<script type="text/javascript">      var uploadStarted = false;     function OnUploadStart(){                     uploadStarted = true;     }      function OnUploadComplete(state,message){                if(state == 1)         alert("Success: "+message);             else          if(state == 0 && uploadStarted)             alert("Error:"+( message ? message : "unknow" ));     }     </script>   <iframe id="uploader" name="uploader" onload="OnUploadComplete(0)" style="width:0px;height:0px;border:none;"></iframe>  <form id="sender" action="/upload.php" method="post" target="uploader" enctype="multipart/form-data" onsubmit="OnUploadStart()"> <input type="file" name="files[upload]"/> <input type="submit" value="Upload"/> </form> 

On server side:

/*   file: upload.php */ <?php      // do some stuff with file           print '<script type="text/javascript">';   if(success)      print 'window.parent.OnUploadComplete(1,"File uploaded!");';   else      print 'window.parent.OnUploadComplete(0, "File too large!");';   print  '</script>'; ?>