• State Suggested Answer
  • Replies 10 replies
  • Answers 1 answer
  • Subscribers 12 subscribers
  • Views 3754 views
  • Users 0 members are here
Related Discussions
Home » Discussions » User Interface

Header in interface

sudheern0003
A Score Level 1

In a grid, can we have two sub header's under one header, like the way we can do in excel sheet.

Please suggest

  Discussion posts and replies are publicly visible

  • 0
    Appian Employee

    Hi , your grid can only have one header. 

    In a certain way, you can simulate 2 sub headers with 2 gridRowLayouts with disabled/readOnly components before. The look and feel will not be ideal but, as far as I know, it's the only way to have a similar behavior

  • 0
    A Score Level 1
     in reply to Pedro Simões

    Grid row lay out for components right, so I didn't get you.

    Can you please eloborate with example how can I achieve it pls, that's the main problem actually.

  • 0
    Appian Employee
     in reply to sudheern0003

    Looking something like this (adapted the recipe https://docs.appian.com/suite/help/20.3/recipe-add-edit-and-remove-data-in-an-inline-editable-grid.html)

    a!localVariables(
  local!employees: {
    a!map(
      id: 1,
      firstName: "John",
      lastName: "Smith",
      department: "Engineering",
      title: "Director",
      phoneNumber: "555-123-4567",
      startDate: today() - 360
    ),
    a!map(
      id: 2,
      firstName: "Michael",
      lastName: "Johnson",
      department: "Finance",
      title: "Analyst",
      phoneNumber: "555-987-6543",
      startDate: today() - 360
    ),
    a!map(
      id: 3,
      firstName: "Mary",
      lastName: "Reed",
      department: "Engineering",
      title: "Software Engineer",
      phoneNumber: "555-456-0123",
      startDate: today() - 240
    ),
    
  },
  a!formLayout(
    label: "Add or Update Employee Data",
    instructions: "Add, edit, or remove Employee data in an inline editable grid",
    contents: {
      a!gridLayout(
        totalCount: count(local!employees),
        headerCells: {
          a!gridLayoutHeaderCell(label: "First Name"),
          a!gridLayoutHeaderCell(label: "Last Name"),
          a!gridLayoutHeaderCell(label: "Department")
        },
        columnConfigs: {
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
          a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
        },
        rows: {
          a!gridRowLayout(
            contents: {
              a!textField(value: "Header 1", disabled: true),
              a!textField(value: "Header 2", disabled: true),
              a!textField(value: "Header 3", disabled: true),
              
            }
          ),
          a!gridRowLayout(
            contents: {
              a!textField(value: "Header 11", disabled: true),
              a!textField(value: "Header 22", disabled: true),
              a!textField(value: "Header 33", disabled: true),
              
            }
          ),
          a!forEach(
            items: local!employees,
            expression: a!gridRowLayout(
              contents: {
                a!textField(
                  /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                  label: "first name " & fv!index,
                  value: fv!item.firstName,
                  saveInto: fv!item.firstName,
                  required: true
                ),
                a!textField(
                  label: "last name " & fv!index,
                  value: fv!item.lastName,
                  saveInto: fv!item.lastName,
                  required: true
                ),
                a!textField(
                  label: "last name " & fv!index,
                  value: fv!item.lastName,
                  saveInto: fv!item.lastName,
                  required: true
                )
              }
            )
          )
        },
        rowHeader: 1
      )
    },
    buttons: a!buttonLayout(
      primaryButtons: a!buttonWidget(label: "Submit", submit: true)
    )
  )
)

  • 0
    A Score Level 1
     in reply to Pedro Simões

    I wanted header1 and Header 11, horizontally as two individual columns under one main header "First Name".

    like shown below.

     

  • 0
    Appian Employee
     in reply to sudheern0003

    , do you really need "First Name" to be a grid header? Why don't you have it as a richText and then have a normal grid with Header 1 and Header 11 in your header?

  • 0
    A Score Level 1
     in reply to Pedro Simões

    its just one of the part of the entire page which we need to show to user, and there many such headers with sub headers are required.

  • 0
    Appian Employee
     in reply to sudheern0003

    As far as I know, the range of options are limited what I expose before. You can have a combination of those approaches, mix richTexts with multiple grids to achieve what you want...

  • 0
    A Score Level 1
     in reply to sudheern0003

    If in any case below mentioned screenshot can be done please let me know, 

  • 0 in reply to sudheern0003

    Hi ,

    Please try this code and i am hoping this will help you in some way.

    a!localVariables(
    local!employees: {
    a!map(
    id: 1,
    firstName: "John",
    lastName: "Smith",
    department: "Engineering",
    title: "Director",
    phoneNumber: "555-123-4567",
    startDate: today() - 360
    ),
    a!map(
    id: 2,
    firstName: "Michael",
    lastName: "Johnson",
    department: "Finance",
    title: "Analyst",
    phoneNumber: "555-987-6543",
    startDate: today() - 360
    ),
    a!map(
    id: 3,
    firstName: "Mary",
    lastName: "Reed",
    department: "Engineering",
    title: "Software Engineer",
    phoneNumber: "555-456-0123",
    startDate: today() - 240
    )
    },
    {
    a!richTextDisplayField(
    value: a!richTextHeader(text: "PATTERN 1")
    ),
    a!cardLayout(
    padding: "NONE",
    contents: {
    a!gridLayout(
    totalCount: count(local!employees),
    borderStyle: "LIGHT",
    spacing: "DENSE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
    a!gridLayoutHeaderCell(
    label: "",
    helpTooltip: "Firs Name Header",
    align: "LEFT"
    ),
    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
    },
    columnConfigs: {
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
    },
    rows: {
    a!forEach(
    items: local!employees,
    expression: a!gridRowLayout(
    contents: {
    a!textField(
    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
    label: "first name " & fv!index,
    value: fv!item.firstName,
    saveInto: fv!item.firstName,
    required: true
    ),
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    ),
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    )
    }
    )
    )
    },
    rowHeader: 1
    )
    }
    ),
    a!richTextDisplayField(
    value: a!richTextHeader(text: "PATTERN 2")
    ),
    a!columnsLayout(
    spacing: "NONE",
    columns: {
    a!columnLayout(
    contents: {
    a!cardLayout(
    padding: "NONE",
    contents: {
    a!gridLayout(
    totalCount: count(local!employees),
    borderStyle: "LIGHT",
    spacing: "DENSE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
    a!gridLayoutHeaderCell(
    label: "",
    helpTooltip: "Firs Name Header",
    align: "LEFT"
    ),

    },
    columnConfigs: {
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),

    },
    rows: {
    a!forEach(
    items: local!employees,
    expression: a!gridRowLayout(
    contents: {
    a!textField(
    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
    label: "first name " & fv!index,
    value: fv!item.firstName,
    saveInto: fv!item.firstName,
    required: true
    ),
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    )
    }
    )
    )
    },
    rowHeader: 1
    )
    }
    )
    }
    ),
    a!columnLayout(
    contents: {
    a!cardLayout(
    padding: "NONE",
    contents: {
    a!gridLayout(
    totalCount: count(local!employees),
    borderStyle: "LIGHT",
    spacing: "DENSE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
    },
    columnConfigs: {
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
    },
    rows: {
    a!forEach(
    items: local!employees,
    expression: a!gridRowLayout(
    contents: {
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    )
    }
    )
    )
    },
    rowHeader: 1
    )
    }
    )
    }
    )
    }
    ),
    a!richTextDisplayField(
    value: a!richTextHeader(text: "PATTERN 3")
    ),
    a!cardLayout(
    padding: "NONE",
    contents: {
    a!columnsLayout(
    spacing: "NONE",
    showDividers: true(),
    columns: {
    a!columnLayout(
    contents: {
    a!gridLayout(
    totalCount: count(local!employees),
    borderStyle: "LIGHT",
    spacing: "DENSE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
    a!gridLayoutHeaderCell(
    label: "",
    helpTooltip: "Firs Name Header",
    align: "LEFT"
    ),

    },
    columnConfigs: {
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),

    },
    rows: {
    a!forEach(
    items: local!employees,
    expression: a!gridRowLayout(
    contents: {
    a!textField(
    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
    label: "first name " & fv!index,
    value: fv!item.firstName,
    saveInto: fv!item.firstName,
    required: true
    ),
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    )
    }
    )
    )
    },
    rowHeader: 1
    )
    }
    ),
    a!columnLayout(
    contents: {
    a!gridLayout(
    totalCount: count(local!employees),
    borderStyle: "LIGHT",
    spacing: "DENSE",
    headerCells: {
    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
    },
    columnConfigs: {
    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
    },
    rows: {
    a!forEach(
    items: local!employees,
    expression: a!gridRowLayout(
    contents: {
    a!textField(
    label: "last name " & fv!index,
    value: fv!item.lastName,
    saveInto: fv!item.lastName,
    required: true
    )
    }
    )
    )
    },
    rowHeader: 1
    )
    }
    )
    }
    )
    }
    )
    }
    )

    a!localVariables(
  local!employees: {
    a!map(
      id: 1,
      firstName: "John",
      lastName: "Smith",
      department: "Engineering",
      title: "Director",
      phoneNumber: "555-123-4567",
      startDate: today() - 360
    ),
    a!map(
      id: 2,
      firstName: "Michael",
      lastName: "Johnson",
      department: "Finance",
      title: "Analyst",
      phoneNumber: "555-987-6543",
      startDate: today() - 360
    ),
    a!map(
      id: 3,
      firstName: "Mary",
      lastName: "Reed",
      department: "Engineering",
      title: "Software Engineer",
      phoneNumber: "555-456-0123",
      startDate: today() - 240
    )
  },
  {
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 1")
    ),
    a!cardLayout(
      padding: "NONE",
      contents: {
        a!gridLayout(
          totalCount: count(local!employees),
          borderStyle: "LIGHT",
          spacing: "DENSE",
          headerCells: {
            a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
            a!gridLayoutHeaderCell(
              label: "",
              helpTooltip: "Firs Name Header",
              align: "LEFT"
            ),
            a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
          },
          columnConfigs: {
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
          },
          rows: {
            a!forEach(
              items: local!employees,
              expression: a!gridRowLayout(
                contents: {
                  a!textField(
                    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                    label: "first name " & fv!index,
                    value: fv!item.firstName,
                    saveInto: fv!item.firstName,
                    required: true
                  ),
                  a!textField(
                    label: "last name " & fv!index,
                    value: fv!item.lastName,
                    saveInto: fv!item.lastName,
                    required: true
                  ),
                  a!textField(
                    label: "last name " & fv!index,
                    value: fv!item.lastName,
                    saveInto: fv!item.lastName,
                    required: true
                  )
                }
              )
            )
          },
          rowHeader: 1
        )
      }
    ),
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 2")
    ),
    a!columnsLayout(
      spacing: "NONE",
      columns: {
        a!columnLayout(
          contents: {
            a!cardLayout(
              padding: "NONE",
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
                    a!gridLayoutHeaderCell(
                      label: "",
                      helpTooltip: "Firs Name Header",
                      align: "LEFT"
                    ),
                    
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                            label: "first name " & fv!index,
                            value: fv!item.firstName,
                            saveInto: fv!item.firstName,
                            required: true
                          ),
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        ),
        a!columnLayout(
          contents: {
            a!cardLayout(
              padding: "NONE",
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        )
      }
    ),
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 3")
    ),
    a!cardLayout(
      padding: "NONE",
      contents: {
        a!columnsLayout(
          spacing: "NONE",
          showDividers: true(),
          columns: {
            a!columnLayout(
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
                    a!gridLayoutHeaderCell(
                      label: "",
                      helpTooltip: "Firs Name Header",
                      align: "LEFT"
                    ),
                    
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                            label: "first name " & fv!index,
                            value: fv!item.firstName,
                            saveInto: fv!item.firstName,
                            required: true
                          ),
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        )
      }
    )
  }
)

  • 0 in reply to sudheern0003

    Hi ,

    Please try below code, hope this will help you in some way.

    Regards,

    Abdul Lateef

    a!localVariables(
  local!employees: {
    a!map(
      id: 1,
      firstName: "John",
      lastName: "Smith",
      department: "Engineering",
      title: "Director",
      phoneNumber: "555-123-4567",
      startDate: today() - 360
    ),
    a!map(
      id: 2,
      firstName: "Michael",
      lastName: "Johnson",
      department: "Finance",
      title: "Analyst",
      phoneNumber: "555-987-6543",
      startDate: today() - 360
    ),
    a!map(
      id: 3,
      firstName: "Mary",
      lastName: "Reed",
      department: "Engineering",
      title: "Software Engineer",
      phoneNumber: "555-456-0123",
      startDate: today() - 240
    )
  },
  {
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 1")
    ),
    a!cardLayout(
      padding: "NONE",
      contents: {
        a!gridLayout(
          totalCount: count(local!employees),
          borderStyle: "LIGHT",
          spacing: "DENSE",
          headerCells: {
            a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
            a!gridLayoutHeaderCell(
              label: "",
              helpTooltip: "Firs Name Header",
              align: "LEFT"
            ),
            a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
          },
          columnConfigs: {
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
            a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
          },
          rows: {
            a!forEach(
              items: local!employees,
              expression: a!gridRowLayout(
                contents: {
                  a!textField(
                    /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                    label: "first name " & fv!index,
                    value: fv!item.firstName,
                    saveInto: fv!item.firstName,
                    required: true
                  ),
                  a!textField(
                    label: "last name " & fv!index,
                    value: fv!item.lastName,
                    saveInto: fv!item.lastName,
                    required: true
                  ),
                  a!textField(
                    label: "last name " & fv!index,
                    value: fv!item.lastName,
                    saveInto: fv!item.lastName,
                    required: true
                  )
                }
              )
            )
          },
          rowHeader: 1
        )
      }
    ),
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 2")
    ),
    a!columnsLayout(
      spacing: "NONE",
      columns: {
        a!columnLayout(
          contents: {
            a!cardLayout(
              padding: "NONE",
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
                    a!gridLayoutHeaderCell(
                      label: "",
                      helpTooltip: "Firs Name Header",
                      align: "LEFT"
                    ),
                    
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                            label: "first name " & fv!index,
                            value: fv!item.firstName,
                            saveInto: fv!item.firstName,
                            required: true
                          ),
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        ),
        a!columnLayout(
          contents: {
            a!cardLayout(
              padding: "NONE",
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        )
      }
    ),
    a!richTextDisplayField(
      value: a!richTextHeader(text: "PATTERN 3")
    ),
    a!cardLayout(
      padding: "NONE",
      contents: {
        a!columnsLayout(
          spacing: "NONE",
          showDividers: true(),
          columns: {
            a!columnLayout(
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "First Name", align: "RIGHT"),
                    a!gridLayoutHeaderCell(
                      label: "",
                      helpTooltip: "Firs Name Header",
                      align: "LEFT"
                    ),
                    
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3),
                    
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            /* Labels are not visible in grid cells but are necessary to meet accessibility requirements */
                            label: "first name " & fv!index,
                            value: fv!item.firstName,
                            saveInto: fv!item.firstName,
                            required: true
                          ),
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            ),
            a!columnLayout(
              contents: {
                a!gridLayout(
                  totalCount: count(local!employees),
                  borderStyle: "LIGHT",
                  spacing: "DENSE",
                  headerCells: {
                    a!gridLayoutHeaderCell(label: "Department", align: "CENTER")
                  },
                  columnConfigs: {
                    a!gridLayoutColumnConfig(width: "DISTRIBUTE", weight: 3)
                  },
                  rows: {
                    a!forEach(
                      items: local!employees,
                      expression: a!gridRowLayout(
                        contents: {
                          a!textField(
                            label: "last name " & fv!index,
                            value: fv!item.lastName,
                            saveInto: fv!item.lastName,
                            required: true
                          )
                        }
                      )
                    )
                  },
                  rowHeader: 1
                )
              }
            )
          }
        )
      }
    )
  }
)

© 2024 Appian. All rights reserved.