Format Data in a Grid

SAIL Recipes give you an opportunity to explore different interface design patterns. To learn how to directly use SAIL recipes within your interfaces, see Adapt a SAIL Recipe to Work with My Applications.


Format the data from a data store entity to display in a read-only paging grid, specifically a first and last name column as a user's display name and a date to a more readable format.

This recipe uses an employee data structure and objects created through the Use the Write to Data Store Entity Smart Service Function on an Interface recipe. Make sure that recipes has been built first in order to see data in this recipe.


This scenario demonstrates:

  • How to query data using a!queryEntity()
  • How to format the data that is returned from the query to display in the grid


  local!pagingInfo: a!pagingInfo(
    startIndex: 1,
    batchSize: 10,
    sort: a!sortInfo(
      field: "firstName",
      ascending: true
    * local!datasubset is pulling data from the employee data store entity 
    * from the entity backed record tutorial.
    * To use your data, change the constant from cons!EMPLOYEE_ENTITY to one of
    * your own. Then replace the fields in the queryColumns to a
    * relevant datapoint from your data store entity
    local!datasubset: a!queryEntity(
        selection: a!querySelection(columns: {
          a!queryColumn(field: "firstName"),
          a!queryColumn(field: "lastName"),
          a!queryColumn(field: "department"),
          a!queryColumn(field: "title"),
          a!queryColumn(field: "phoneNumber"),
          a!queryColumn(field: "startDate")
        pagingInfo: local!pagingInfo
      totalCount: local!datasubset.totalCount,
      columns: {
          label: "Name",
          field: "firstName",
          data: a!forEach(
            items: local!,
            expression: fv!item.firstName & " " & fv!item.lastName
          label: "Department",
          field: "department",
          data: index(local!, "department", null)
          label: "Title",
          field: "title",
          data: index(local!, "title", null)
          label: "Phone Number",
          data: index(local!, "phoneNumber", null)
          label: "Start Date",
          field: "startDate",
          data: a!forEach(
            index(local!, "startDate", null),
            text(fv!item, "mmm dd, yyyy")
          alignment: "RIGHT"
      value: local!pagingInfo,
      saveInto: local!pagingInfo

Test it Out

  1. Adjust the sorting of name field of live view and make sure the paging info values will reset to descending alphabetical order

Notable implementation details

  • The grid displays the text representation of all types, including Appian Objects such as a user, so we applied our own formatting
  • a!forEach() is used in these formatting cases because the expressions used to format this data will only evaluate the first value in the datasubset. For expressions that can handle arrays, a!forEach() is typically not needed.
  • Sorting for name is currently by first name. This can be adjusted at the field parameter of the first a!gridTextColumn().