Display Members of Selected Groups in Grid Columns

Do you have a specific question?

I am stuck at displaying the group of members in grid. How should I do that?

I think your approach is wrong. Grids are used to show set of data in tabular form. Where as your data (in your code) it's more like a tree or hierarchy  . 

So can you suggest me correct approach, where display the members of those selected groups? 

a!localVariables(
  local!selectedGroup: ri!initialGroup,
  local!distinctUsers: if(
    a!isNullOrEmpty(local!selectedGroup),
    "Please select a group",
    a!flatten(
      a!forEach(
        items: local!selectedGroup,
        expression:a!localVariables(
          local!group:fv!item,
          a!forEach(
          items: getdistinctusers({fv!item}),
          expression: a!map(id: fv!index, Group:local!group,Members: fv!item )
        ))
      )
    )
  ),
  local!groupName: a!forEach(
    items: local!selectedGroup,
    expression: getgroupnames(fv!item)
  ),
  local!pagingInfo: a!pagingInfo(startIndex: 1, batchSize: 10),
  {
    a!sectionLayout(
      label: "User & Group Management",
      contents: {
        a!pickerFieldGroups(
          label: "Pick Groups",
          labelPosition: "ABOVE",
          maxSelections: 5,
          value: ri!initialGroup,
          saveInto: ri!initialGroup,
          
        )
      }
    ),
    a!sectionLayout(
      label: "Group members",
      contents: {
        a!columnsLayout(
          columns: a!forEach(
            items: local!selectedGroup,
            expression: a!columnLayout(
              a!gridField(
                label: "",
                labelPosition: "ABOVE",
                data: index(
                  local!distinctUsers,
                  wherecontains(
                    touniformstring(fv!item),
                    touniformstring(local!distinctUsers.Group)
                  )
                ),
                columns: a!gridColumn(
                  label: group(
                    groupId: togroup(fv!item),
                    property: "groupName"
                  ),
                  value: fv!row.Members
                ),
                pagingSaveInto: local!pagingInfo
              )
            )
          )
        )
      }
    )
  }
)

It's not exactly what you looking for but i did few changes to your code (It can be modified to fit for better practices). I used Columns layout have a look into it. FYI: It's not the better approach

Thanks that' what I was trying but with grid eventually it also helps me understand. I understood it's not a better approach. Is it possible for us to add or remove members from the group in columns layout?

Yes , you can do that. Grid is there Inside columnslayout ,you can write selection for grid and trigger a process to remove members or you can use a!removeGroupMembers()

Yes , you can do that. Grid is there Inside columnslayout ,you can write selection for grid and trigger a process to remove members or you can use a!removeGroupMembers()

Thank you very much for clarifying the doubt.