File Upload Example

This example will walk you through the necessary steps to accept file uploads on your Formeezy forms. This example builds on the Basic Form Example and will cover the small differences needed to upload files to a Formeezy form endpoint.

Overview

Ensure your form has the enctype="multipart/form-data" attribute
Uploading one file
Uploading multiple files

Making sure your form can submit files

To enable file submissions on your HTML form, simply add the enctype="multipart/form-data" to the attributes on the form element. This attribute specifies how form-data should be encoded when submitting to a server.


<form action="{Formeezy-Endpoint}" method="POST" enctype="multipart/form-data">
<!-- Inputs go here -->
</form>

Upload a file from your HTML form

Now that you've added the proper attributes to your form, all that's left is to add file inputs and start accepting files.


<form action="{Formeezy-Endpoint}" method="POST" enctype="multipart/form-data">
  <input type="file" name="my-file"></input>
  <button type="submit">Send</button>
</form>

Replace the action attribute with your Formeezy endpoint.

Upload multiple files with multiple inputs from an HTML form

Uploading multiple files is as easy as adding more inputs to your form. We allow up to 5 individual files with a maximum file size of 10MB.


<form action="{Formeezy-Endpoint}" method="POST" enctype="multipart/form-data">
  <input type="file" name="my-file"></input>
  <input type="file" name="my-image"></input>
  <input type="file" name="my-pdf"></input>
  <input type="file" name="my-doc"></input>
  <button type="submit">Send</button>
</form>

Upload multiple files with one input from an HTML form

Uploading multiple files from one input can be accomplished using the multiple boolean attribute on an input. This will allow your users to select multiple files to be uploaded at once, requiring only a single input.


<form action="{Formeezy-Endpoint}" method="POST" enctype="multipart/form-data" multiple>
  <input type="file" name="my-file"></input>
  <input type="file" name="my-image"></input>
  <input type="file" name="my-pdf"></input>
  <input type="file" name="my-doc"></input>
  <button type="submit">Send</button>
</form>

Supported file types

The following file types are supported by Formeezy file upload forms:

Documents

pdf
doc
docx
ppt
pptx
xls
xlsx
key
pages
numbers
psd
ai
eps
epub
mobi
azw
tar
zip
rar
7z

Media Files (Audio/Video/Image)

png
jpg
jpeg
tiff
tif
gif
webp
scm
mp3
mp4
flv
avi
webm
mov

Text & Other

html
htm
xml
sketch
txt
rtf

Notes

Ensure your form has the enctype="multipart/form-data" attribute
Ensure your file upload file-type is supported. We recommend adding the accept attribute to your file inputs on your form ie. accept=".jpg, .jpeg, .png"
For performance reasons, we limit uploads to a maximum of 5 files, and a max-size of 10MB each.
See our fetch/React examples for uploading files via JavaScript.

File Upload Example