Let me give you some feedback as to what I'm trying to do...

I'm working on a site where users can add multiple content but once they click the submit button it takes them to the next step. Here's the thing though, they can add the same content multiple times. So what I've done is created a javascript class that handles all the submit process. Once you submit the page it copies the values into a javascript array before actually submitting it to a PHP page.

Here's the kicker, file input boxes are read only, meaning you cannot set the value because of browser security. So this left me with an issue. What I tried doing is taking the element's parent node (a label container) and removing the child (the actual file input box) then using apendChild moving it to the actual form where they can submit it but again this doesn't work although I thought it should since I'm not altering the value. It doesn't retain the value that the user actually selected after I use appendChild.

So this has left me with an issue that I have to handle using AJAX uploads. I haven't looked into this much but I wanted to get some feedback from the community before I started diving into it.

Do I have to use an iframe to submit the file upload fields? Is there any way I can do it without an iframe? If I do use an iframe how do I move the file input box to the iframe's content area? All of that seemed like my original solution would have worked so I'm somewhat stuck at this point until I look into it further.