Form within a form in HTML? - php

Question

I created an application form with HTML and on that application the user has to upload his resume. I was thinking to create a form within the form to let the user upload his resume such as:
<div class="application-form">
<form class="contact-form" action="application-form.php" method="post">
<div class="application-data">
<label>First Name</label>
<input type="text" name="first">
</div>
<div class="application-data">
<label>Last Name</label>
<input type="text" name="last">
</div>
<div class="application-data">
<label>Email</label>
<input type="email" name="email">
</div>
<div class="application-data">
<label>Phone Number</label>
<input type="phone" name="phone">
</div>
<div class="resume">
<form action="">
<label>Resume</label>
<input type="file" name="resume">
<button type="submit">Submit Resume</button>
</form>
</div>
</form>
</div>
Seems this is not possible in HTML. What is the best alternative? thanks

Answer 1

I don't see the need for the nested form here...just remove it and make the file upload part of the application-form.php handler. Also add the enctype attribute to your <form> to accept files.
<div class="application-form">
<form class="contact-form" action="application-form.php" method="post" enctype="multipart/form-data">
<div class="application-data">
<label>First Name</label>
<input type="text" name="first">
</div>
<div class="application-data">
<label>Last Name</label>
<input type="text" name="last">
</div>
<div class="application-data">
<label>Email</label>
<input type="email" name="email">
</div>
<div class="application-data">
<label>Phone Number</label>
<input type="phone" name="phone">
</div>
<div class="resume">
<label>Resume</label>
<input type="file" name="resume">
<button type="submit">Submit Resume</button>
</div>
</form>
</div>