HTML form file upload hello world

HTML forms can have file type as input field to update and send files to server. To be able to handle file upload, it need to have form attribute enctype="multipart/form-data". Here is a quick code snippet which has file upload input and posts to a dummy endpoint/url. The endpoints just dumps the information about uploaded file using php $_POST and $_FILES object.

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<form id="form1" enctype="multipart/form-data" action="/api/post-dump.php" method=POST>
name1: <input type="text" name="name1" value="value1" /><br/>
file1: <input type="file" name="file1" />
<input type="submit" name="submit" value="submit"/>
</form>
refresh


Here is how request headers look like for a form post with file upload:
html-form-file-upload-headers

Share this article: share on Google+ share on facebook share on linkedin tweet this submit to reddit

Comments

Click here to write/view comments