An attachment field is a type of field that allows you to attach one or more files directly to a record within your data model.

In this article we are going to cover:

  • Adding an attachment field

  • Uploading attachments

  • Downloading attachments

  • Renaming attachments

  • Removing attachments

  • Using attachments

Adding an attachment field

To add an attachment field that is to the right of the existing fields. Give a name to your field and select the attachment type.

Once you've created an attachments field, you can start uploading attachments into it.

Uploading attachments

To upload an attachment you must (A) click on the cell, (B) press the "+" button, (C) select the file that you wish to upload and (D) press "open" to upload the attachment.

Ditto Tip: note, we allow you to upload any type of attachment (JPG, PNG, WAV etc.) with no limits on the maximum size of a file that you wish to upload. Please note however that your workspace has a maximum amount of storage associated with it. You can increase this by choosing a different workspace plan.

Downloading attachments

You can download images either by clicking on the individual cell and pressing the download button:

Or by expanding the entire record and clicking the download button next to each image.

Renaming attachments

To rename an attachment, open the image or collection of images in an expanded view. Next, click the pencil icon to the right hand side of the download button.

Removing attachments

To remove an attachment, you need to (A) open the attachment in an expanded view, (B) click the delete button below each attachment and (C) press save.

Using attachments

When using the attachments field in your app, there a few technical considerations to be aware of.

First, the attachments are stored as arrays of text values that point to the location of the file in your apps docker container. The reason for this is that you can have multiple attachments in each record.

As an example, take a look at the response from a GET endpoint where the returned record contains multiple attachments.

// Get properties endpoint response
"data": [
      "Id": 2,
      "Address": "Property 2",
      "Property Images": [
          "id": "7cd87603-a23c-416b-835b-6da6d9fb100c",
          "url": "1343/uploads/7cd87603-a23c-416b-835b-6da6d9fb100c-Property2.jpg",
          "filename": "Property2.jpg",
          "width": 5472,
          "height": 3080,
          "type": "image/jpeg",
          "size": 4612406,
          "small": null,
          "medium": null,
          "large": null,
          "filepath": "7cd87603-a23c-416b-835b-6da6d9fb100c-Property2.jpg"
          "id": "3924035b-5785-4ff8-bc13-b3be8acb25e4",
          "url": "1343/uploads/3924035b-5785-4ff8-bc13-b3be8acb25e4-Property2Bedroom.jpg",
          "filename": "Property2Bedroom.jpg",
          "width": 4032,
          "height": 3024,
          "type": "image/jpeg",
          "size": 1719104,
          "small": null,
          "medium": null,
          "large": null,
          "filepath": "3924035b-5785-4ff8-bc13-b3be8acb25e4-Property2Bedroom.jpg"
          "id": "5313fa36-5289-459f-b64c-8784728be4f6",
          "url": "1343/uploads/5313fa36-5289-459f-b64c-8784728be4f6-Property2Kitchen.jpg",
          "filename": "Property2Kitchen.jpg",
          "width": 4288,
          "height": 2848,
          "type": "image/jpeg",
          "size": 968833,
          "small": null,
          "medium": null,
          "large": null,
          "filepath": "5313fa36-5289-459f-b64c-8784728be4f6-Property2Kitchen.jpg"

As you can see, the Property Images field (of type attachment) contains a structure that includes details such as id, URL, filename, width, height etc. If you're looking to display the image in the frontend of your app, you would need to specify which image you want to display from the list of returned images.

Last updated