Skip to main content

(2) Define the User Interface

- Support Ticket Tutorial -​

With a simple data foundation complete, it is time to fill the Ticket Entity pages that were established above: Create Page, Detail Page and List Page.

7. Define the Ticket List Page​

The Ticket List Page will be a simple list of Support Tickets, with the User, the Time Created and the Severity.

  • In the sidebar, click UI. In the UI side panel, locate the Entity Pages subsection
  • Double-click Ticket List
  • On the Ticket List overview, the Columns tab will show by default
  • Entity detail column is added by default to create a link to the Ticket Detail page
  • Click the (+) Add Column
  • Select the additional columns that will appear: Created By, Created Date and TicketSeverity
  • Click Close
  • In the Created date row, click the checkbox in the Default column for sorting column and choose Descending from the dropdown
    • Tickets will be sorted from the most recent
  • Save changes: Ctrl + S

8. Define the Ticket Create Page​

The Ticket Create page will define how new tickets will be created.

  • In the Entity Pages subsection, double-click Ticket Create
  • In the center of the page, click Add View. Click Create Empty View for Ticket
  • In the layout editor add Data Fields. Click Title, TicketSeverity and Description
  • Click OK   
  • Click Title field
  • Click Magic Wand in Validations section
  • Click Not empty string
    • This creates a validation to ensure that each ticket has a name filled in

Set the Layout so that it can be shared on the Ticket Detail page.

  • In the Layout section, click More in the top-right corner of the view
  • Click Make Shared
  • Click Ctrl + S

9. Define the Ticket Detail Page​

The Ticket Detail page will serve as the repository for the Support Tickets. It will use the shared view that was established on the Ticket Create page.

  • In the Entity Pages subsection, double-click Ticket Detail
  • In the center of the page: Click Add View
  • Click Add Shared View for Entity Ticket
  • Save changes: Ctrl + S

10. Application Menu​

The User Interface now needs links to create and access tickets.

  • In the UI side panel, locate the Application Menu button at the top
  • Click Application Menu
  • Click (+) Add Menu Item
  • Set Menu Item Action to List page
  • Set List page to Ticket list
  • Click OK
      
  • Click (+) Add Menu Item again
  • Set Menu Item Action to Entity create page
  • Set Entity Page to Ticket create
  • Change the Menu Item Icon to (+) Create
  • Click OK
  • Save changes: Ctrl + S