SharePoint List Attachments: A Drag and Drop Solution

Photo credit: Kelly Sikkema

Article Updated: Feb 18, 2022

The Problem

SharePoint document libraries allow you to quickly drag files from your computer and drop them in a library. I recently ran into a situation where I needed similar functionality for attachments on a SharePoint list item. I assumed the functionality was built-in and I was rather surprised to find out that it didn’t work natively.

The solution was to use a Power App integration on the list form. It worked great and it was very quick to implement.

Use Case

Why would need to drop multiple files on a list item in the first place?

In my use case, I wanted to be able to tag a group of files and assign the same default properties (e.g., Category, Assigned To, Status, etc.). This is possible in a document library but involves convoluted folder configurations. The default values in a library don’t hold if an Office document already has that value set from a previous SharePoint location.

In my use case, the new item would trigger a Power Automate workflow. Then the following would happen:

  1. The properties of the item were “stored”
  2. The attachments are copied to a document library
  3. The copied attachments have their properties set from the stored values (in 1)
  4. The list item was deleted

The result is that all attachments end up in a Document library with the same properties. The list item itself is only used to set the initial values and is deleted by the workflow when the files are processed.

Quick Steps

I’m going to walk through the very basic steps to accomplish this.

Note: If you have a complicated list with a lot of fields, this can be much more difficult.

Step 1: Create a List

From the site home page select New > List

We’ll use a blank list for this example:

Give the List a name:

Step 2: Add Columns

Use the Add column button to add columns.

I added a choice column called Status and a people column called Assigned To.

Step 3: Check the Form

Click the New button to look at the form. It should look very standard.

In the attachment area (highlighted above) I was hoping that just dropping a file (or files) would upload it. This did not work. 😟

Step 4: Replace the Form

Click the Edit form (1) button and choose Customize with Power Apps (2).

Power Apps will load and add some fields to the form.

Note: Sometimes Power Apps won’t add all your fields to the form, but it does open with the Fields panel displayed, so you can quickly add the ones you want. In this example, it did add all the ones I needed.

Step 5: Save the Form

Click Return to SharePoint (1) and Save and publish (2).

Note: You may need to make at least one change to the Power Apps form before the form will publish to SharePoint.

It is worth looking at the advanced properties on the attachment control.

  • The MaxAttachment is set to 6 by default so you may want that value set lower or higher.
  • The MaxAttachmentSize defaults to 10Mb but can be set as high as 250Mb.
  • The AddAttachmentText is set to "Attach file" but could be modified to something like "Click to attach file(s) or drag files here"

Step 6: Test the Form

Click the New button to show the form.

Note: Once you return to the SharePoint site, you may have to refresh several times (try CTRL+F5) before the new form will appear.

Fill out the fields, choose some local files, drag/drop them to the Attachments area, and click save.

The files will upload, and the item will be saved.

Issues

With any workaround there are bound to be some issues. Here are the ones I found.

Folders

You can’t drag over folders in this solution. If you attempt to drag and drop a folder, you will receive a “Something went wrong” error.

I would probably argue if you were using folders here you probably want to be using a Document library, not a list.

Mobile

The SharePoint App seems to work with the Power App form, but you navigate in a mobile browser you way get a very basic experience without the form.

If you use the Microsoft Lists app the new form displays the SharePoint version (not the Power Apps version).

Neither of these issues are serious. Dragging and dropping files on mobile is basically impossible (iPad not tested).

Downloads

By default, when you open a list item with a Power App form and click on an attachment, that attachment will automatically download instead of opening. In my use case this wasn’t an issue because I was moving the attachments to a library, but it’s certainly annoying that it doesn’t open the file using the associated viewer like it does in the default SharePoint form.

Controls

In some cases the Power App controls don’t “feel” like the SharePoint controls. You can see this is the Choice and People controls (among others). This is purely subjective but I have had people complain about certain Power App controls.

Bonus

One of the minor requirements was to have the ability to attach email messages directly from Outlook. It was nice to find out that the Power Apps implementation of the drag and drop for list items supported dragging emails directly from Outlook desktop (not working from Outlook online).

Conclusion

As long as you are not dealing with a complicated list, this seems like a perfectly acceptable solution if you require drag and drop for your list item attachments. The benefits seem to outweigh the issues (for the most part).

If you don’t need an interface to the list items (as in my use case) you could actually just create a full Power App and use the list as a data source for new items. Then give users a link to the full Power App.

Author: Mike Hatheway

I'm a husband, father of twins, and a consultant specializing in M365. Generally focused on Teams, SharePoint, and the Power Platform. I hold several Microsoft certifications and I work at Bulletproof Solutions.

3 thoughts

  1. Hi Mike,
    Did you find a solution to the “Downloads” issue you’ve noted? I’ve found your post whilst searching for a solution to that exact problem.
    Regards,
    Brett

    Like

    1. I haven’t had the need to dig into this further. I assume you could hide the default attachment control in view mode, and show a different control (e.g. HTML or gallery) that would open the attachment links properly.

      Like

  2. GREAT advance on adding attachments to list items!

    As a tactic I’ve used since the Internet Explorer* days:
    The URL path to the attachments of a list item is a fixed URL using item id:
    http://%5Byourtennant%5D.microsoft.com/%5Byoursite%5D/lists/%5Byourlistname%5D/attachments/%5Bid%5D
    a link column with the value file://[yourtennant].microsoft.com/[yoursite]/lists/[yourlistname]/attachments/[id] will open a desktop File Explorer window to that path – allowing drag/drop/zip file actions.*

    *I mention Internet Explorer days because modern browsers have removed the ability for the browser to open a file system window, (clicking the link in modern Edge/Chrome will do nothing.)
    BUT – Edge still supports “Internet Explorer Mode” – re-enabling this capability.

    There’s a couple of list attachment intensive business processes we’ve created, in which participants just switch the browser to IE mode to engage with the list.

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.