2

I use the sample below to do the upload file in LWC:

html:

<template>
  <lightning-file-upload
        label="Attach receipt"
        name="fileUploader"
        accept={acceptedFormats}
        record-id={myRecordId}
        onuploadfinished={handleUploadFinished}
        multiple>
  </lightning-file-upload>
</template>

js:

import { LightningElement, api } from 'lwc';
export default class MyComponentName extends LightningElement {
@api
myRecordId;

get acceptedFormats() {
    return ['.pdf', '.png'];
 }

handleUploadFinished(event) {
    // Get the list of uploaded files
    const uploadedFiles = event.detail.files;
    alert("No. of files uploaded : " + uploadedFiles.length);
 }
}

But when I push to org., it cannot click the upload file button. May I know what causing this issue?

5
  • sorry html part: ''' <template> <lightning-file-upload label="Attach receipt" name="fileUploader" accept={acceptedFormats} record-id={myRecordId} onuploadfinished={handleUploadFinished} multiple> </lightning-file-upload> </template> '''
    – Chauncy
    Aug 19, 2019 at 3:05
  • where are you loading this component? Aug 19, 2019 at 5:52
  • I loading this component in an app in App luncher.
    – Chauncy
    Aug 20, 2019 at 6:23
  • Can you please share your js-meta.xml for the component? Please make sure that the component is added to a detail record page and not to an application or home page as it requires the record Id for the file upload template to work.
    – Zarq Iqbal
    Sep 5, 2019 at 13:30
  • In your example code I would change myRecordId to recordId, in both the html and js.
    – TonyC
    Apr 30, 2020 at 8:34

1 Answer 1

1

Documentation: 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. For more information, see Upload and Share Files in Salesforce Help.

You need to check below:

  1. Don't allow HTML uploads as attachments or document records security setting

  2. Lightning Out or standalone apps - is not supported

3
  • Thank you very much for your answer. I am the newer for salesforce lwc for the item 2 Lightning Out or standalone apps - is not supported. May I know what is for Lightning out? I just add the component to an application in App Luncher, is that Lightning out or standalong app
    – Chauncy
    Aug 20, 2019 at 6:22
  • to an application means? Are you using aura:application in it? Aug 20, 2019 at 6:42
  • Add an new lightning App in App manager and not use the aura:application. Just add the lwc to new lightning app.
    – Chauncy
    Aug 20, 2019 at 7:09

Not the answer you're looking for? Browse other questions tagged or ask your own question.