upload delete and preview files attachments lightning component -- w3web.net

How to get upload/delete and preview the files attachments through apex class uses of lightning:fileCard and lightning:fileUpload elements in Salesforce Lightning component | file Uploader With Preview & Delete in aura component Salesforce

Hey guys, In this post we are going to learn about How to get upload/delete and preview the files attachments through apex class uses of lightning:fileCard and lightning:fileUpload elements in Salesforce Lightning component

Attach Files to Records

Attach files to records for a powerful way to collaborate and stay organized in Salesforce. Keep information on an opportunity, account, case or sObject (Custom Object) right where you need it. Share relevant documents with anyone with access to the record. To know more details about Attach Files to Records, click Here.

Requirement:- Upload the custom file on lightning component such like (jpg’, ‘jpeg’,’pdf’, ‘doc’) etc.. then iterate the list of attachment record and get preview (zoom), delete file dynamically.

Files we used to Preview & Delete aura component in this post example

UploadFileCmp.cmp Lightning Component It is used for create the table of Preview & Delete attachment file in aura component.
UploadFileCmpController.js JavaScript Controller File It is used for communicate to server side apex method and fetch list of file and attachment from salesforce object.
UploadFileCmpHelper.js JavaScript Helper File It is hold for Javascript Helper Function to get file & attachment from apex method.
UploadFileCmp.css Style CSS It is used to create a content box border color and alignment.
uploadFileHandler.apxc Apex Class Controller It is used for fetch the attachment files from sObject in Salesforce.

Standard Object:- ContentDocument

Object and their fields:- LinkedEntityId, ContentDocumentId, Title, FileType

Final Output

upload delete and preview files attachments lightning component -- w3web.net

Other related post that would you like to learn in lightning component.

  • Find the below steps

Create Lightning Component

Step 1:- Create Lightning Component : UploadFileCmp.cmp

From Developer Console >> File >> New >> Lightning Component

UploadFileCmp.cmp [Lightning Component File]

Create JavaScript Controller

Step 2:- Create Lightning Component : UploadFileCmpController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

UploadFileCmpController.js [JavaScript Controller]

Create JavaScript Helper

Step 3:- Create Lightning Component : UploadFileCmpHelper.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Helper

UploadFileCmpHelper.js [JavaScript Helper File]

Step 4:- Create Lightning Component Style: UploadFileCmp.css

From Developer Console >> File >> New >> Lightning Component >> Component Style CSS

UploadFileCmp.css [Style CSS]

Create Apex Class Controller

Step 5:- Create Apex Class : uploadFileHandler.apxc

From Developer Console >> File >> New >> Apex Class

uploadFileHandler.apxc [Apex Class Controller]

upload delete and preview files attachments lightning component -- w3web.net

Further post that would you like to learn in LWC

Create a Flyout Account, It will help you to grow make more money for a better living.

List your blog on Flyout and start making money for publishing sponsored content on your blog. Here’s the invite link. Get Started for Free

Check Out:- Earn Unlimited Everyday With This Trick:- Click Here

FAQ (Frequently Asked Questions)

What is the difference between file and attachment in Salesforce?

Files need to upload, store, share, and collaborate on Salesforce files in the cloud. Attach files to records from the Attachments related list on selected detail pages. We can upload a file and store it privately until you're ready to share it.

Where are Salesforce attachments?

Attachments appear in the Notes & Attachments Related List. Salesforce Files use ContentVersion records which are then associated with a parent record.

How do I convert attachments in Salesforce?

we need to insert the new file record into Salesforce. But if we insert the new record we can lose Created Date, LastModified Date, CreatedById, and Last Modified By Id.

Related Topics | You May Also Like

Hi, This is Vijay behind the admin and founder of w3web.net. I am a senior software developer and working in MNC company from more than 8 years. I am great fan of technology, configuration, customization & development. Apart of this, I love to write about Blogging in spare time, Working on Mobile & Web application development, Salesforce lightning, Salesforce LWC and Salesforce Integration development in full time.

2 thoughts on “How to get upload/delete and preview the files attachments through apex class uses of lightning:fileCard and lightning:fileUpload elements in Salesforce Lightning component | file Uploader With Preview & Delete in aura component Salesforce”

Leave a Comment