Showing attached files

Marketing & Content Hub Lead Capture Tools
1

Hey all. I have an embedded form in one of the fields which contains the ability to attach multi-files. The problem is that clients, after adding files to the form, don’t see them. Can I make it so on the application link when people click upload, they can see the documents they uploaded?

Here’s what it looks like:

SkMLLkH.png
SkMLLkH.png815×177 13.9 KB

2

Hey @PUsik this is not currently possible out of the box within HubSpot forms.

If you want to customize the input you can create a completely custom html form with any inputs and integrate with HubSpot using the API.

I’d also like to note that sensitive information (such as bank statements) is against HubSpots TOS to store on their systems, so might be worth investigating a more secure upload facility for banking info!

3

Thank you all. Found a solution, maybe someone will be useful.

If you select the script when installing the contact form HupSpot, with the additional help of the listener can achieve the output of attached files.

<script>
 hbspt.forms.create({
 region: "na1",
 portalId: "YouPortalId",
 formId: "YouformId",
 onFormReady: function($form) {
 var input = $form.find('input[name="YouImputFileFieldName"]');
 input.on('change', function() {
 var fileList = this.files;
 var list = document.createElement('ul');
 for (var i = 0; i < fileList.length; i++) {
 var listItem = document.createElement('li');
 listItem.innerHTML = fileList[i].name;
 list.appendChild(listItem);
 }
 var fileListContainer = document.getElementById('fileList');
 if (!fileListContainer) {
 fileListContainer = document.createElement('div');
 fileListContainer.setAttribute('id', 'fileList');
 input.parentNode.insertBefore(fileListContainer, input.nextSibling);
 }
 fileListContainer.innerHTML = '';
 fileListContainer.appendChild(list);
 });
 }
 });
</script>

After that, in the place where you want to display the names of the attached files to place this div.

<div id="fileList"></div>

4

Hey there!

We’ve just released the Attachment From Form app on the HubSpot Marketplace!

If you’re tired of playing hide-and-seek with files in your HubSpot database, you’re in the right place! Attachment From Form simplifies the process by linking files submitted in a form directly to the corresponding contact record. Say goodbye to the endless file hunt and say hello to effortless access!

Here are the standout features:

1. Effortless Form-Attachment Connection: Easily link your forms to contact attachments.

2. Efficient File Retrieval: When a contact submits a file type property in your form, it appears in the attachment card, saving you valuable time.

3. Organized Activity Section: Attachment From Form creates custom activities, making it a breeze to find attached files on the contact page while maintaining a comprehensive property attribution history.

Get organized and supercharge your efficiency with the Attachment From Form app now! And the best part? It won’t cost you a dime.

You can install it right away → LINK