Search.../

value

Returns a list of files that are pending upload.

Description

Returns a list of File Info objects that a site visitor has selected to upload after clicking the upload button.

See how value is used in the typical file upload scenario code example.

Type:

Array<File>Read Only
NAME
TYPE
DESCRIPTION
name
string

File name.

size
number

File size in bytes.

valid
boolean

true if the file is valid for upload to the Media Manager.

validationMessage
string

Message indicating why the file is invalid. Empty if the file is valid.

Was this helpful?

Get the files pending upload

Copy Code
1let files = $w("#myUploadButton").value;
2let fileName = files[0].name; // "mypic.jpg"
3let fileSize = files[0].size; // 45941
4let fileValidity = files[0].valid; // true
5let fileValidationMsg = files[0].validationMessage; // ""
Typical file upload scenario

This example uploads multiple files when the site visitor clicks a button. First it sets the type of file a site visitor can choose (in this case, an image). Then the example checks to see if the site visitor chose files using the upload button. If files were chosen, it triggers the uploadFiles() function and logs the status of the file upload when it completes successfully or with an error.

Copy Code
1$w("#myUploadButton").fileType = "Image"; // Site visitor can choose an image
2$w('#myButton').onClick( () => {
3 if ($w("#myUploadButton").value.length > 0) { // Site visitor chose a file
4 console.log("Uploading the following files:")
5 $w("#myUploadButton").uploadFiles()
6 .then( (uploadedFiles) => {
7 uploadedFiles.forEach(uploadedFile => {
8 console.log("File url:" + uploadedFile.fileUrl);
9 })
10 console.log("Upload successful.");
11 } )
12 .catch( (uploadError) => {
13 console.log("File upload error: " + uploadError.errorCode);
14 console.log(uploadError.errorDescription);
15 } );
16 }
17 else { // Site visitor clicked button but didn't choose a file
18 console.log("Please choose a file to upload.")
19 }
20} );
21
22