<Upload>

This is a conventional <input type="file"> that is submitted when the form is submitted. Consider the alternative <LiveUpload> which will start uploading immediately.

By default file uploads are sent to GetFormally.com however for data sovereignty reasons the destination of live uploads can be controlled with <Formally onLiveUpload={myLiveUpload} prop (that's an SDK feature).

Use of `<Upload>`

<Upload
  id="myUpload"
  name="recentphoto"
  labelHtml={{
    en: 'A recent photo',
  }}
  accept="image/*"
  hintHtml={{
    en: 'Any photo within the past two years.',
  }}
/>

`<Upload>`'s props

Prop	About	Type
`accept`	Defines the accepted file types (e.g. images, videos, or both). The `accept` attribute is a comma-separated list of file extensions or MIME types. `".image/"` — accept any image (mobile browsers often use this to allow camera photos). `".png"` — accept only `.png` files. `"video/, .png" — accept any video OR a` .png` Each browser uses `accept` differently, so test! Read more at https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept	`string`
`clearUploadHtml`	Localisable HTML: Clear upload button content	`LocalisedHtml`
`hideInAnswerSummary`	Whether to hide any answers below this.	`boolean`
`hintHtml`	Localisable HTML: Hint content	`LocalisedHtml`
`isRequired`	Whether users are required to fill in this form field. This setting affects `aria-required` and whether a * is displayed next to the form field, etc.	`boolean`
`labelHelpPopoutContentButtonLabel`	Localisable text: Popout Content button label	`LocalisedPlainText`
`labelHelpPopoutContentModalContentHtml`	Localisable text: Popout Content modal title	`LocalisedHtml`
`labelHelpPopoutContentModalHeadingHtml`	Localisable text: Popout Content modal title	`LocalisedHtml`
`labelHtml`	Localisable HTML: Label content	`LocalisedHtml`
`maxSizeAllFilesBytes`	Maximum total file size of upload in bytes. This is only client-side validation of file size. Servers should implement their own limits.	`number`
`multiple`	The `multiple` attribute in HTML (MDN `multiple` attribute) Whether to support multiple files in a single `<input type="file">`.	`boolean`
`name`	The `name` attribute in HTML (MDN name attribute) Name of the form control. Submitted with the form as part of a name:value pair in the `<Formally onSubmit>` callback prop `valuesAsFormNames`.	`string`
`validationErrorInvalidHtml`	Localisable HTML: invalid validation content	`LocalisedHtml`
`validationErrorRequiredHtml`	Localisable HTML: required validation content	`LocalisedHtml`
`id`	Component Id. Must be unique within the form.	`string`
`meta`	Arbitrary metadata on this node. This is useful when developing custom controls as it allows you to pass down metadata/extensions.	`string`
`hasChildrenById`	Non-editable. Used to indicate that this component doesn't have children.	`false`
`hasTagsById`	Non-editable. Used to indicate that this component isn't a form field with tags by id.	`false`
`isFormField`	Non-editable. Used to indicate that this component is a form field.	`true`
`isMultichoice`	Non-editable. Used to indicate that this component isn't a multichoice form field like `<Select>`, `<Radios>` or `<Checkboxes>`.	`false`
`type`	Non-editable. Type of component of `"Upload"`.	`"Upload"`

<Upload>

Search

Table of contents

Use of `<Upload>`

`<Upload>`'s props

<Upload>

Search

Table of contents

Use of <Upload>

<Upload>'s props

Use of `<Upload>`

`<Upload>`'s props