some form el...">
Geek Answers Handbook

Using nested forms in an html document

I am trying to set one form to another in my html document as follows:

<form1 action="1.php"> some form elements ................... <form2 enctype="multipart/form-data" action="upload.php" target="upload_target" onsubmit="startUpload();> <input name="myfile" type="file"/> <input type="submit" name="submitBtn" class="sbtn" value="Upload" /> </form> </form> <iframe id="upload_target" name="upload_target" src="#"></iframe>

The first form receives data from the user and inserts it into my database. The second form does upload files using jquery and iframe, as in this example: upload a file with iframe and jquery

I am trying to upload a file this way because I cannot do this by simply transferring data to a php file using javascript (using ajax). And the problem is that nested forms are not supported by w3c standards. What can I do to solve this problem? Thanks for the help and sorry for my poor english.

+4
source share
2 answers

Once I ran into one problem, so here is my suggestion: you can put form2 in another container, for example. a div that is outside of form1 and will adjust its position using css (z-index, absolute position or something like that), so it looks like one form.

The disadvantages of this approach are obvious, but with a little effort you can deal with them to a certain level.

Another suggestion: since you are still working with javascript, submit the upload form to an invisible div and launch it by clicking / hovering the upload button or entering the last field of form1 or something else.

+6
source

You do not have a nested form. Try to avoid this and separate the shapes as shown below. And when submitting any form, if you are data from another form, create hidden fields in this form and submit it.

 <form1 action="1.php"> some form elements ................... </form> <form2 enctype="multipart/form-data" action="upload.php" target="upload_target" onsubmit="startUpload();> <input name="myfile" type="file"/> <input type="submit" name="submitBtn" class="sbtn" value="Upload" /> </form>
+3
source

More articles:


All Articles