Filopplastinger File-input element.

Struktur

<lk-file-uploader>
  ...
</lk-file-uploader>

Attributter

Merknader: må*, bør, husk, ekstra.

Attributt Tillatte verdier Default Beskrivelse
guid* string "" <input> sin id= og <label> sin for=
input-mame string "" <input> sin name=
hidden-input-name string "attachments"
label string "Last opp fil(er)" Tekst for <label>
error-message string "Du må laste opp vedlegg"
rename string "" Filene fra getFiles()-metoden får nye filnavn, med nummerering hvis det er flere filer ("_1", "_2", osv.), og bevarer fil-extension (f.eks. ".pdf"). (Filnavnene i brukergrensesnittet og files-property blir ikke endret.)
accept csv:string "*" F.eks.: ".jpg,.jpeg"
preset-accept string ""
max-bytes
max-kb
max-mb
number ""
allow-multiple-files boolean true
required boolean false
disabled boolean false
small boolean false
show-files boolean true
ghost-files JSON-array:string "" Brukes ifm. mellomlagring
dataHiddenValue string "" Brukes ifm. mellomlagring

Spalter

Spalter/slots brukes for dynamisk innhold/struktur inni komponenten. Ref. Stenciljs.com

Slot= Default Beskrivelse
"help-text" Maks filstørrelse; Tillatte filtyper Blir plassert inni <label>

Metoder

Merk at alle metoder er asynkrone. Ref. Stenciljs.com

Metode Parameter Retur Beskrivelse
validate
checkValidity
() valid:boolean
getFiles () Array<File>

Eksempler

Denne komponenten er implementert som en webkomponent, og kan enkelt legges inn med en enkelt custom HTML-tag.

<form id="test-form" enctype="multipart/form-data" novalidate="" action="" method="post">

  <lk-file-uploader guid="fileinput1" input-name="upload1" rename="test" small>
  </lk-file-uploader>
  
  <lk-file-uploader guid="fileinput2" input-name="upload2" 
                    label="Last opp et bilde ved å trykke her, eller dra og slipp et bilde rett fra datamaskinen."
                    accept=".png,.jpg,.jpeg" allow-multiple-files="false">
  </lk-file-uploader>

  <lk-file-uploader guid="fileinput3" input-name="upload3" 
                    required
                    preset-accept="images,documents,emails" max-mb="2">
  </lk-file-uploader>

</form>

Hvor finner jeg denne koden?