Menu
I'm currently working on a form which includes some file inputs to upload pictures. There is an onchange() event for those inputs that submits the pictures to an iframe, then dynamically loads the uploaded pictures into the form, with fields to be modified for them (like name and geo-localization).
Since I can't nest forms, the file_input is also contained in an iframe. In the end I use an iframe inside of another iframe. So I have something like this:
<form> <!-- LOTS OF FIELDS!! --> <iframe src="file_input_url"> <!-- iframe which loads a page of a form with a file input--> </iframe> </form> and the HTML loaded into the iframe is something like (excluding the html, head and body tags)
<form target="upload_iframe"> <input type="file" onchange="this.form.submit()"> </form> <iframe name="upload_iframe"></iframe> This works great, except for the fact that it takes a couple seconds to load the first iframe, so the file input does not load with the rest of the page. This is not visually ideal. I could solve it if I could specify the iframe content without needing to load another page (specified by file_input_url in the first iframe).
Is there a way to specify the iframe content in the same document, or can it only be specified with the src attribute, requiring the load of another page?
888
In order to embed the intended document within the <iframe>, the address of the target document should be specified as src attribute value.
The HTML <iframe> src attribute is used to specify the URL of the document that are embedded to the <iframe> element. Attribute Values: It contains single value URL which specifies the URL of the document that is embedded to the iframe.
Set the iframe to the appropriate width and height and set the scrolling attribute to "no". If the area you want is not in the top-left portion of the page, you can scroll the content to the appropriate area.
You can .write() the content into the iframe document. Example:
<iframe id="FileFrame" src="about:blank"></iframe> <script type="text/javascript"> var doc = document.getElementById('FileFrame').contentWindow.document; doc.open(); doc.write('<html><head><title></title></head><body>Hello world.</body></html>'); doc.close(); </script> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
