lightning:fileUpload Example

lightning:fileUpload component provides an easy and integrated way for users to upload multiple files. The file uploader includes drag-and-drop functionality and filtering by file types. File uploads are always associated to a record, hence the recordId attribute is required. Uploaded files are available in Files Home under the Owned by Me filter and on the record’s Attachments related list on the record detail page. Although all file formats that are supported by Salesforce are allowed, you can restrict the file formats using the accept attribute. Here is the example code .

Lightnin Component 



Code walkthrough 

  1. event.getParam(“files”) returns a list of uploaded files with the properties name and The file name in the format filename.extension.documentId: The ContentDocument Id in the format 069XXXXXXXXXXXX.

2. Below code will show the Toast on Successfully file upload

3.below code will open the file preview after file upload.

File Upload Limits

By default, you can upload up to 10 files simultaneously unless your Salesforce admin has changed that limit. The org limit for the number of files simultaneously uploaded is a maximum of 25 files and a minimum of 3 files. The maximum file size you can upload is 2 GB. In Communities, the file size limits and types allowed follow the settings determined by community file moderation. Guest user can’t add files.

Usage Considerations

This component is not supported in Lightning Out or standalone apps, and displays as a disabled input. Additionally, if the Don't allow HTML uploads as attachments or document records security setting is enabled for your organization, the file uploader cannot be used to upload files with the following file extensions: .htm, .html, .htt, .htx, .mhtm, .mhtml, .shtm, .shtml, .acgi, .svg.