Extends HTMLElementSafe

Properties

disabled

Disable the field and sets the disabled attribute

disabled: boolean

webkitdirectory

Set the field webkitdirectory state

webkitdirectory: boolean

multiple

Toggle the field multiple state

multiple: boolean

readOnly

Set field as readonly. Only for situations where FilePond has initial files and those files should be posted. The readonly attribute isn’t supported on a file input element as it cannot have an initial value.

readOnly: boolean

required

Set field as required

required: boolean

accept

Accepted files setter https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/accept

accept: string

animations

Setting to toggle animations

animations: AnimationMode

noBrowse

Toggle browse button

noBrowse: boolean

minSize

Min file size setter, accepts a number of bytes or a natural filesize string like 1MB

minSize: number | string | undefined

maxSize

Max file size setter, accepts a number of bytes or a natural filesize string like 1MB

maxSize: number | string | undefined

minListSize

Min total file size setter, accepts a number of bytes or a natural filesize string like 1MB

minListSize: number | string | undefined

maxListSize

Max total file size setter, accepts a number of bytes or a natural filesize string like 1MB

maxListSize: number | string | undefined

minFiles

Min total entries setter, an integer, defaults to 0

minFiles: number

maxFiles

Max total entries setter, an integer, defaults to Infinity

maxFiles: number

entries

Set the current entries

entries: FilePondEntry[]

locale

Sets the locale

locale: Locale | undefined

extensions

Sets custom extensions to load

extensions: ExtensionFactory[]

workersURL

Update worker url

workersURL: URL

on

Subscribe to internal entryTree events

on: EntryTreeOn

name

Sets the current field name

name: string | undefined

form

Proxy for Element internals form getter 

form: HTMLFormElement | undefined

value

Sets/Updates the value of the the entry manager

Will also remember this value for when form is reset

value: FilePondEntry[]

validity

Proxy for element internals validity getter 

validity: ValidityState

validationMessage

Proxy for element internals validationMessage getter 

validationMessage: string

Methods

browse

Opens the system file browser

browse(
):void

insertEntries

Add one or more entries to the end of the list or insert them at a specific index

insertEntries(
  entry: FilePondEntry | FilePondEntry[], 
  index?: number | number[]
):void

findEntries

Find entries in the entry tree

findEntries(
  ...needles: Needle[]
):FilePondEntry | (FilePondEntry | undefined)[] | undefined

removeEntries

Find entries in the entry tree

removeEntries(
  ...needles: Needle[]
):void | {
        entry: FilePondEntry;
        index: number[];
    } | (void | {
        entry: FilePondEntry;
        index: number[];
    })[]

sortEntries

Sorts the entry tree using the passed sorting function

sortEntries(
  fn: (a: FilePondEntry, b: FilePondEntry) => 1 | -1 | 0
):void

updateEntry

Update an entry

updateEntry(
  needle: Needle, 
  ...props: any[]
):void

updateEntryState

Update an entry state

updateEntryState(
  needle: Needle, 
  ...props: any[]
):void

moveEntry

Move entry from current location to new index

moveEntry(
  needle: Needle, 
  index: number | number[]
):void

replaceEntry

Replace entry with one or more entries

replaceEntry(
  needle: Needle, 
  ...entries: FilePondEntry[]
):void

checkValidity

Validates the current state of the field

checkValidity(
):boolean | undefined

reportValidity

Proxy for element internals reportValidity() method

reportValidity(
):void

Events

change

Fired when form value changed

element.addEventListener("change", (e) => {
  // Event handler
});

update

Fired when entries list updated

element.addEventListener("update", (e) => {
  // Event handler
});

connected

Fired when connected to the DOM

element.addEventListener("connected", (e) => {
  // Event handler
});