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
    Nov 1 '18 at 20:03
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
    Nov 1 '18 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
    Nov 1 '18 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
    Nov 1 '18 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
    Nov 1 '18 at 20:14
  • Just to add here, lightning:input of type = "file" has file size limitation.
    – Sarang
    Feb 26 '21 at 8:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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