using Lightning:fileUpload to attach files to a record that isn't created yet

Question

I am building a lightning component to replace the standard "Contact Support" form on our lightning community. Lightning is new territory for me, so I am learning all I can from documentation.

I recently learned about lightning:fileUpload:

<lightning:fileUpload label="Upload Attachment" multiple="true" recordId="{!v.recordId}"/>

It provides a very user friendly out-of-the-box file uploading solution to bake into a component, however, it requires a record Id to function. Without providing a record Id, the uploader becomes automatically disabled on the page. I reviewed the code sample in the component library HERE and it appears that the files are uploaded immediately once the user drops them in/selects them, so it's understandable why there needs to be a record Id to relate them to.

Problem: What I'm trying to do is allow the user to attach a file to a case while creating it, so in my scenario the Id of that case doesn't exist until they press "Submit Case" on the component. If the case has no Id, I can't assign it to the File Uploader, so it won't work.

As an alternative, I considered assigning the current User Id to the File Uploader, so all attachments will be linked to the user, and then I could run some code in my save() method later to re-assign all of the User's uploaded files to the newly created ticket, but that assumes that the user doesn't have other files that would be moved accidentally.

Also by using this approach a user could upload files and never actually complete the form and contact support, resulting in 'orphaned' files left over that I would have to figure out how to delete.

Is there a more correct way to approach this?

Answer 1

As an alternative, I considered assigning the current User Id to the File Uploader, so all attachments will be linked to the user, and then I could run some code in my save() method later to re-assign all of the User's uploaded files to the newly created ticket, but that assumes that the user doesn't have other files that would be moved accidentally.

If you handle the onuploadfinished event you can retrieve the ContentDocumentId of the newly uploaded files and hold them in memory. On ticket creation you can reassign the files or insert a new ContentDocumentLink from the Case to the created files.

Since you are able to "find" these files as soon as you get that ID, you can implement logic to tag them as in-process files and clean up orphans later. The only "true" orphan edge case you're left with is if the user quits after the upload but before your code has finished reacting to it.

Answer 2

In one of the orgs I have worked in we wanted to be able to do something similar. What we ended up doing was creating an additional submit button called 'submit and upload files'. When the user clicked this it would submit the case, get the Id, and then open a file upload component where the user could attach one or more files to the case. When the user was done uploading the files and clicked finished they would then be directed to the case detail page.

Answer 3

I had to handle this recently and it was especially difficult with a site guest user... here is what I came up with:

https://www.linkedin.com/pulse/how-heck-do-i-attach-file-record-via-site-guest-user-shawn-kuruganti/

Let me know if it is helpful or you have any questions :).