I am doing file upload async with jquery/php using the target attribute of a form. The target is my iframe named "uploads"; To manage error in the php file, I return string like "ERR_TOO_LARGE_FILE" with an echo which will be inside the iframe body.
The problem is I don't know how to detect when the iframe is ready and access its content to see if there's an error. I tried the following code but it didn't work:
$("#uploads").on("load", function() {
alert($(this).html());
});
an alert box did appear, but nothing inside. I also tried using the ready event instead but this time, nothing appears.
Would like to know a way to achieve this or an alternate solution if you have a better one.
Because you're not allowed to modify the content of an iframe, at least you're not suppose to, you can't directly access it using jquery. Use .contents()
& .find()
to get the html from the iframe so you can get the info you need.
So,
$("#uploads").on("load", function() {
alert($(this).contents().find('html').html());
});
should return the contents of the html in the iframe. You can swap out the 'html' for a tag id if you know the specific element you're looking for.