Appian Community and Appian Academy are being upgraded. From July 24–August 3, the Appian Community will be in read-only mode. During this time, the site will be read-only and user registration will be disabled. We apologize for any inconvenience this may cause, but a more secure, stable, and performant Community experience is coming soon!

The new Appian Community launches August 3, followed by Appian Academy on August 7. During the migration, Appian Community Edition, Appian Academy, Documentation, Certifications, Instructor-led Customer Training, Partner Sales Training & Accreditation, and Forum (for Appian Partners and Customers only) will remain available.

interface making

Certified Associate Developer

CAn any one tell how can I do the following in Interface,

1. I want a multiple selection option on a grid, having submit,cancel button on the bottom.

2. Another grid below the above one to get the data populated in this grid based on selection made on above grid after clicking submit button.

'Please help me, i am new please provide detail solution I would very helpfull.

Thank you for understanding

  Discussion posts and replies are publicly visible

Parents
  • 0
    Certified Lead Developer

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

Reply
  • 0
    Certified Lead Developer

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

Children
No Data