---
tags:
- UI Page widgets
alias: user-guide-uipage-widgets-entity-attachments
widgetname: Entity Attachment
description: "This documentation details configuring a widget to display and manage attachments associated with entities"
---

# Entity Attachment

![entityAttachmentIcon][entityAttachmentIcon]

## Overview

The Entity Attachment widget is used to display attachments for a given instance. You can also customize the appearance of the attachments component.
An example is shown below, where this widget is used to show all the attachments for a certain **Material**.

![entityAttachmentExample][entityAttachmentExample]

## General Steps

{% include-markdown 'includes/pages/ui_widgets_general_steps_with_behavior.md' %}

![Screenshot showing a widget for attaching entities.](images/entity_attachment_general.png)

## Widget Customization

1. Optionally, in the **Style** tab, you can define a Border Width and Color.

    ![Screenshot showing an Entity Attachment Style widget customization interface with options for border width and color.](images/entity_attachment_style.png)

2. In the **Setup** tab, define the Entity Type and the Entity.

    ![Screenshot showing a configuration screen for an Entity Attachment widget with options for selecting Entity Type and Entity.](images/entity_attachment_setup.png)

3. In the **Layout** tab, the visual properties of the widget are configured, such as:

    * **Show Entity** - Controls the visibility of the Entity. This option is set to `true` by default.
    * **Show Action Bar** - Controls the display of the Action Bar. This option is set to `true` by default.
    * **Show Add Button** - Controls the display of the Add Attachments dialog when the Entity has no attachments. This option is set to `true` by default.
    * **Show Open Button** - Controls the display of the Open button in the Action Bar. For attachments with URL sources, this button opens the URL in a new browser tab.  This option is set to `true` by default.
    * **Show Download Button** - Controls the display of the Download Button in the Action Bar. This option is set to `true` by default.
    * **Alow Filters** - Controls the display of the Filter Bar. This option is set to `true` by default.
    * **Allow Multi-Selection** - Enable the multiple selection of the attachments. If disabled, it defaults to Selection Mode None. This option is set to `true` by default.
    * **Alow Open** - Makes the attachment names in the grid clickable so that they can be visualized via the View Attachment wizard or open a URL in case the Attachment is a URL. This option is set to `true` by default.
    * **Default Page Size** - Sets the page size of the attachments data grid. The default page size is 10.

    ![Screenshot showing a widget customization interface with an option labeled "Widget Entuy Attachinents" set to 9.](images/entity_attachment_layout.png)

4. Optionally, define the **Links** between this widget and other elements of the UI Page.

    ![Screenshot showing the setup of link details in the Entity Attachment widget's Links tab.](images/entity_attachment_links.png)

5. By saving and closing the settings, the widget will be changed accordingly.

## Real Use Case

The example below demonstrates how to link a Entity Attachment widget to a [[user-guide-uipage-widgets-form]] widget.

1. Configure Entity Attachment widget, namely the Setup tab to choose the Entity Type and the Entity.

    ![Screenshot showing a configuration screen for an Entity Attachment widget with options for selecting Entity Type and Entity.](images/entity_attachment_setup.png)

2. Configure the Form widget Fields as shown below.

    ![Screenshot showing a configuration of the Form widget fields for an entity attachment use case.](images/entity_attachment_use_case_form_widget.png)

3. In the **Links** tab of the Entity Attachment widget, set up the link details as shown below.

    ![Screenshot showing the setup of link details in the Entity Attachment widget's Links tab.](images/entity_attachment_links.png)

4. Alternatively, you can use the **Links Diagram** in the UI Page builder.

    ![Screenshot showing a Links Diagram in the UI Page builder, with various entities and materials listed.](images/entity_attachment_use_case_links.png)

5. The final result should resemble this:

    ![final result](images/entity_attachment_use_case_final_result.png)

[entityAttachmentIcon]: images/uiEntityAttachments.png
[entityAttachmentExample]: images/uiPageExample13.png