I'm using "lightning-file-upload" LWC and it is working fine, I'm just not sure how to access the file name and document ID as mentioned in the knowledge article below:
https://developer.salesforce.com/docs/component-library/bundle/lightning-file-upload/documentation
Below is my LWC code:
HTML File
<template>
<lightning-card title="CSV File Uploader" icon-name="custom:custom20">
<lightning-file-upload
label=""
name="fileUploader"
accept={acceptedFormats}
record-id={recordId}
onuploadfinished={handleUploadFinished}
multiple>
</lightning-file-upload>
</lightning-card>
JS File
import { LightningElement, track,api } from 'lwc';
import {ShowToastEvent} from 'lightning/platformShowToastEvent';
import startProcessing from '@salesforce/apex/GIM_CsvUploader.startProcessing';
export default class CsvFileUpload extends LightningElement {
@api recordId;
get acceptedFormats() {
return ['.csv'];
}
handleUploadFinished(event)
{
let strFileNames = '';
// Get the list of uploaded files
const uploadedFiles = event.detail.files;
startProcessing({ DocId: this.recordId, Name: 'test'})
alert( event.detail.files[0].Name);
this.dispatchEvent(
new ShowToastEvent({
title: 'Success!!',
message: ' Following files uploaded Successfully: ',
variant: 'success',
}),
)
}}}
According to the documentation the alert should show the file name of the first uploaded file but it says undefined.
Best Answer
You are having issue with case sensitivity of name attribute in
alert( event.detail.files[0].Name);
The event fired when files are uploaded successfully.The uploadfinished event returns the following parameter.
PARAMETER TYPE DESCRIPTION files object The list of files that are uploaded.
event.detail.files returns a list of uploaded files with the attributes name and documentId.
If you pay attention to Your code, you have used Capital N in name attribute whereas expected is small as JavaScript is case sensitive.