0

I have a lightning component which has a form. The details provided in the form in turn creates a case record in the back-end. I want to attach multiple drag and drop files along with the details provided in the form. For that I am using the following piece of code

<div>
    <lightning:fileUpload label="Attach receipt" 
                          multiple="true" 
                          accept=".pdf, .png, .jpeg, .jpg"
                          onuploadfinished="{!c.handleUploadFinished}" />
</div>

However, the fileupload input is coming as disabled. I have added the lightning component in a lightning tab and checked there. I have also checked in a stand alone app.

From what I uderstand the reason might be because, I do not have a record Id which will be related to the file. If that is the reason, is there any workaround for this. Also, is there any other way of uploading multiple files?

1
  • You can write your own component based on SLDS. That's the only way to "work around" the issue.
    – sfdcfox
    Commented Nov 1, 2018 at 20:03

1 Answer 1

5

From documentation:

File uploads are always associated to a record, hence the recordId attribute is required.

As for:

I have also checked in a stand alone app

The reason is because it's not supported in stand alone app

Usage Considerations

This component is not supported in Lightning Out or standalone apps, and displays as a disabled input.


The component allows multiple file uploads. However you will need a recordId.

A 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.

As for your case, you can create a dummy record and use that only for file uploads, and then once you have your target record created, associate files back to that record. You will need quite a few custom logic to do that way though.

OR

Use lightning:input type="file" to create your own custom component, where it supports multiple uploads and does not require any record id.

<lightning:input name="file1" type="file" label="Attachment" multiple="true" accept="image/png, .zip" onchange="{! c.handleFilesChange }"/>
5
  • As, in my case record gets created from the form where I have the fileupload functionality, it would be impossible to get record id in there. Is there any other way I can do multiple file upload?
    – Madhurima
    Commented Nov 1, 2018 at 20:05
  • Without a recordId, you cannot. Another way would be to associate the files being uploaded to a "dummy" record and as soon as your record gets created, associate it back to the new record. You will just need to write some trigger/custom logic out there.
    – Jayant Das
    Commented Nov 1, 2018 at 20:06
  • Then if I set an aura attribute with a hard-coded Id value and set that in the recordId field, that would work too right?
    – Madhurima
    Commented Nov 1, 2018 at 20:13
  • It should be a valid recordId. But again, using that way may require a lot more custom approach. I have added another option that you can take here by using lightning:input type=file, which can work.
    – Jayant Das
    Commented Nov 1, 2018 at 20:14
  • Just to add here, lightning:input of type = "file" has file size limitation.
    – Sarang
    Commented Feb 26, 2021 at 8:30

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .