<LiveUpload>

Skip past table of contents

Search

Table of contents

Start of documentation content

'Live Upload' is for uploading files.

Live?

The term 'Live' in <LiveUpload> refers to how uploads start immediately after the user chooses a file. This optimises for bandwidth (because uploading begins immediately so it ends sooner) and user feedback (because any upload errors are shown to the user earlier).

Intro

By default file uploads are sent to GetFormally.com.

With the SDK however destination of file uploads can be customised with the onLiveUpload prop.

The total file size of uploads is limited by your subscription.

Use of <LiveUpload>

<LiveUpload

  id="myLiveUpload"

  name="recentphoto"

  labelHtml={{

    en: 'A recent photo',

  }}

  accept="image/*"

  hintHtml={{

    en: 'Any photo within the past two years.',

  }}

/>

<LiveUpload>'s props

PropAboutType
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.

string
cancelUploadHtml

Localisable HTML: Cancel 'upload in progress' button content

LocalisedHtml
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
progressUploadingCompleteLabelHtml

Localisable HTML: Upload complete content

LocalisedHtml
progressUploadingInProgressLabelHtml

Localisable HTML: 'upload in progress' content

LocalisedHtml
uploadingErrorsHtml

Localisable HTML: Upload errors content.

Will be used as a title and localised error messages will be rendered too.

LocalisedHtml
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 "LiveUpload".

"LiveUpload"