RE: interface making

deepakg271869 — Tue, 09 Aug 2022 11:16:00 GMT

you can save your selection index of first grid into a local variable along with entire row value. and after that use the new local variable to show it into the next grid.

a!localVariables(
  local!selection,
  local!selectedEmployees,
  {
    a!richTextDisplayField(
      label: "",
      labelPosition: "COLLAPSED",
      value: {
        a!richTextHeader(
          text: "Performance Review Portal"
        )
      }
    ),
    {a!gridField(
      label: "Employee Directory",
      data: todatasubset(
        {
          a!map(id: 11, name: "Elizabeth Ward",  dept: "Engineering",     role: "Senior Engineer",       team: "Front-End Components",     pto: 15, startDate: today()-500),
          a!map(id: 22, name: "Michael Johnson", dept: "Finance",         role: "Payroll Manager",       team: "Accounts Payable",         pto: 2,  startDate: today()-100),
          a!map(id: 33, name: "John Smith",      dept: "Engineering",     role: "Quality Engineer",      team: "User Acceptance Testing",  pto: 5,  startDate: today()-1000),
          a!map(id: 44, name: "Diana Hellstrom", dept: "Engineering",     role: "UX Designer",           team: "User Experience",          pto: 49, startDate: today()-1200),
          a!map(id: 55, name: "Francois Morin",  dept: "Sales",           role: "Account Executive",     team: "Commercial North America", pto: 15, startDate: today()-700),
          a!map(id: 66, name: "Maya Kapoor",     dept: "Sales",           role: "Regional Director",     team: "Front-End Components",     pto: 15, startDate: today()-1400),
          a!map(id: 77, name: "Anthony Wu",      dept: "Human Resources", role: "Benefits Coordinator",  team: "Accounts Payable",         pto: 2,  startDate: today()-300)
        },
        fv!pagingInfo
      ),
      columns: {
        a!gridColumn(
          label: "Name",
          sortField: "name",
          value: fv!row.name
        ),
        a!gridColumn(
          label: "Department",
          sortField: "dept",
          value: fv!row.dept
        ),
        a!gridColumn(
          label: "Start Date",
          sortField: "startDate",
          value: fv!row.startDate,
          align: "END"
        )
      },
      pageSize: 3,
      selectable: true,
      selectionValue: local!selection,
      selectionSaveInto: {
        local!selection,
        a!save(local!selectedEmployees, append(local!selectedEmployees, fv!selectedRows)),
        a!save(local!selectedEmployees, difference(local!selectedEmployees, fv!deselectedRows))
      }
    ),
    a!gridField(
      pageSize: 2,
      data: local!selectedEmployees,
      showWhen: not(a!isNullOrEmpty(local!selectedEmployees)),
      columns: {
        a!gridColumn(
          label: "Name",
          sortField: "name",
          value: fv!row.name
        ),
        a!gridColumn(
          label: "Department",
          sortField: "dept",
          value: fv!row.dept
        ),
        a!gridColumn(
          label: "Start Date",
          sortField: "startDate",
          value: fv!row.startDate,
          align: "END"
        )
      }
    )
    }
  }
)

RE: interface making

Harshit Bumb (Appyzie) — Tue, 09 Aug 2022 11:14:43 GMT

To achieve this, you should understand the below concepts

Layouts.
Setting up a grid with selections
Understanding how a!save() works.

If you have gone through the course, then I assume you are comfortable with how components are configured on an interface. Using the same knowledge, try to explore the configurations as shown in the above pictures. Use the help of extensive documentation that Appian has created.

RE: interface making

rahuls0029 — Tue, 09 Aug 2022 10:45:58 GMT

Gone through them

RE: interface making

Stefan Helzle — Tue, 09 Aug 2022 10:45:13 GMT

I suggest to work through the Academy trainings and tutorials to learn the basic steps. Once done, you will understand how Appian works. We are happy to support you with more specific questions then.