Header in interface

Hi sudheern0003, 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

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.

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)
    )
  )
)

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

like shown below.

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?

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.

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...

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...