Table of Contents

Store Multiple Images or Files for Individual Records

Danielle Kellogg Updated by Danielle Kellogg

Scenario

Your app stores images and you need to store a variable number of images/files for a single record.

Example: You have an app that manages real estate and you want to display multiple images for each listing.

It is possible to add multiple image or file type fields to a single object, however this will only allow you to add a finite number of images/files to a single record. For example, four image fields in an object, means each record can only have four images associated with that record.

This scenario will allow you to add an unlimited number of images or files connected to a single record.

Requirements

You will need an existing object with records that you want to store multiple images for. In this example, it’s the “Listings” object.

Further, if this your first time creating an app, you'll need to know some basics about adding objects, fields, pages, and views. You can start by reading our Builder Basics section

Other good resources can be found in our designing the database and building pages sections of the knowledge base.

Steps

These steps will cover how to use a connected object to store multiple images for individual records.

Create a New Images/Files Object

In the Schema section of the Builder, click on the green "+" button and create a new object named Images.

Next click on the green "+" button to add an a new image field type to your new Images object and remove the default short text field.

You may also want to add an additional fields such as an auto increment field to provide a unique identifier for each record:

Add a Connection Field

Next we need to connect your new Images object to the object these images are being stored for, in this case it is the Listings object.

In the Images object, add a new connection to the Products object by clicking the green "+" button in the connections section on the right side of the Builder.

Select the Listings object and the type of connection. In this scenario, each Image connects with one Listing and each Listing connects with many Images.

Create a Form to Add Connected Images/Files

In the Pages section of the Builder, select a details page for the Listings object (or whichever object you connected to your Images object). Then click "+ Add View" and select a form view. This will prompt you to choose what type of record the form will create and what it will be connected to. In this case we are submitted a form view that creates Images connected to that page's Listing.

It you set the form to automatically reload, Live App users can continue to add more images as needed.

You can read more about adding and managing forms here.

Displaying the Connected Images

In the Pages section of the Builder, click the "+ Add View" button add a view that displays all the connected Images for a specific Listing. In this example, we will add a list view to display images connected to the Listing on this page:

Login & Test

Now that you have set up your Images to display for connected Listings. While viewing your page in the Pages section of the Builder, click the open icon or the "Go to Live App" button. This will open your Live App in a new window.

How did we do?

Approve New Records Before Displaying Them

Use Multiple Image Sources for a Single Image Field

Contact