Reading response from (simulated) asynchronous file upload with jQuery, IFRAME

Question

I am simulating an asynchronous file upload by targeting an iframe, like so:

<form id="upload_form" action="upload.php" method="POST" enctype="multipart/form-data" target="upload_iframe">
  <input type="file" name="upload_input" />
  <iframe id="upload_iframe" name="upload_iframe" src=""></iframe>
</form>

After a file is selected, the form is submitted like so (using jQuery):

$('#upload_input').change(function() {
  $('#upload_form').submit();
});

The file is uploaded, and the JSON response is sent to the iframe. In Firebug, I can see that the iframe's content is:

<html>
<head></head>
<body>{"success":true}</body>
</html>

I am using the iframe's load event to wait for the response. The load event is firing. (It actually fires twice, which is a minor issue.) However, I can't figure out how to read the response. I have tried various calls, but none of them return anything:

$('#upload_iframe').find('body')
$('#upload_iframe').html()
$('#upload_iframe').text()

Is there something I am missing?

Jeremy · Accepted Answer · 2011-09-28 16:55:31Z

0

I have found a solution that works, although it seems less than ideal. This code goes in the iframe load event handler:

if (!$(this)[0].contentDocument.childNodes[0].children[1].childNodes[0]) 
{
  return;
}
var response = $(this)[0].contentDocument.childNodes[0].children[1].childNodes[0].wholeText;
var json = $.parseJSON(response);

answered Sep 28, 2011 at 16:55

Jeremy

3,4817 gold badges30 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ranoy · Accepted Answer · 2012-07-10 12:31:22Z

0

this should do your work $('#upload_iframe').find('body').text()

answered Jul 10, 2012 at 12:31

Ranoy

1082 gold badges4 silver badges17 bronze badges

Collectives™ on Stack Overflow

Reading response from (simulated) asynchronous file upload with jQuery, IFRAME

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related