Submit a form within an iframe along with the main form.

Hello I have a main form which contains an iframe. The iframe itself also contains a from. I am trying to submit the iframe form alongside with the parent form. I am just wondering if this is possible without copying the iframe's form values into hidden fields in the main form.

Any thoughts on this are appreciated.

Thank you.
LVL 36
Who is Participating?
dorwardConnect With a Mentor Commented:
No, it is in a seperate document and thus is a seperate form. (And you can't set the value of file inputs using JavaScript, its a sucurity risk).

Why are you using an iframe anyway? Perhaps you would be better off with:

<div style="width: 20em; height: 10em; overflow: scroll; border: solid black 1px;">
<input type="file">
girionisAuthor Commented:
Just to add, the iframe's form will eventually contain some inputs of type "file".
girionisAuthor Commented:
Hello dorward thank you for your quick reply. Yes I know about the value of the file inputs, that';s why I asked if I can do it without javascript.

I will look into using a <div> element and I will get back to you.
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

girionisAuthor Commented:
Ok using a div made things better but there is still a problem. I add the <input type="file"> dynamically to the form (we do not know in advance how many files the user will upload) but everytime I add a new file type it resets all the previous ones. I am using the following javascript:

divData.innerHTML = divData + "<input type='file'" + cnt + "'><br>"

where divData is the name of the div element and cnt is a global counter.

If I try to do it differently, adding an element to the node using


where inputFile is the input type file I create,

it just does not send any of those with the request.

Any more thoughts?
girionisAuthor Commented:
Sorry, this:

> divData.innerHTML = divData + "<input type='file'" + cnt + "'><br>"

is actually

divData.innerHTML = divData + "<input type='file' name='fileName'" + cnt + "'><br>"
girionisAuthor Commented:
I will ask this question in the JavaScript category. Thank you for your help.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.