Skip to main content

Components - Attachments

This Advanced Topic will enable the end user to attach a screenshot or a document to a Support Ticket. This will put the list of attachments at the bottom of the detail page in a Document List.

NOTE: This tutorial is built upon the foundation of the Support Ticket application.

1. Create a Ticket Attachment entity​

This step will create a new entity named “Ticket Attachment”. The Composition reference type (1 -> N) will be used.

  • Create a Ticket entity. Type: Ctrl + Shift + C to open the general Create Dialogue; select Entity.
  • Name your Entity: Ticket Attachment
  • Set the Display Icon. (Suggestion: Use “Paperclip”.)
  • Mark the Create Display Attribute checkbox. Click in the text box. Type: Title. This will create an attribute and set it as the display expression for entity records.
  • Click Next.
  • Inside the Create Pages box, keep the Create Page and Detail Page; un-select the List Page.
  • Click Finish
  • Save Changes: Ctrl + S

2. Add Attributes to the Ticket Attachment entity​

  • In the Data Definition > Attributes section, click Add New Attribute Establish the following:
  • Attachment - Document (move into the data-box and type “c”)
  • User - User (type “u”)
  • Date and Time - DateTime (type “t”)
  • Click Create Attributes
  • Save Changes: Ctrl + S

3. Set References​

  • In the Data > Entities subsection, double-click the Ticket entity
  • In the Data Definition > References section, click the Add New Reference
  • Set the Reference Type to: Composition.
  • Set Target to: Ticket Attachment.
  • Click Create References.
  • Save Changes: Ctrl + S

4. Update User Interface​

Go to UI > Entity Pages and double-click on the pages below to update them with the Ticket Attachment attribute.

A. TicketAttachment Create page

  • Click Add View. When the dialog box opens, click OK
  • In the layout editor add Data Fields. Click Title, Ticket and Attachment
    —
  • Define the Attachment expression further. Click Attachment
  • In the Validations Section, click the Magic Wand. Select **Require attached document **
  • Click OK
  • Click OK
    —
    Set the Layout so that it can be Shared on the Detail Page
  • In the Layout section, click the ellipsis …
  • Click Make Shared
  • Click Ctrl + S

B. TicketAttachment Detail page

  • In the center of the page, click Add View
  • Click Type and choose Shared View from the drop-down menu
  • Verify that View Entity is set to: TicketAttachment
  • Set Shared View to: TicketAttachment view
  • Click OK
  • Save changes: Ctrl + S

5. Update Ticket Detail page​

  • Go to UI > Entity Pages and click Ticket Detail
  • Go the Layout section, and click Add Tab (near the bottom of the page)
  • Set Label to: Attachments
  • Set Tab Icon, if necessary
  • Click OK
  • In the tab area, select the Attachments tab and click Add View
  • Click OK
  • In the sidebar, locate Advanced Components and select: Document List
  • Click Document List of TicketAttachment
  • Verify that Item Entity is set to: TicketAttachment
  • Set Document Attribute to: Attachment
  • Set User Attribute to: User
  • Set Created Attribute to: DateAndTime
  • Set Parent Entity Reference to: Ticket
  • Click OK
  • Click OK
  • Save: Ctrl + S

6. Deploy and Run the App​