RE: Navigate bwtween 3 pages with "next" button

Stefan Helzle — Sat, 30 Sep 2023 12:09:44 GMT
docs.appian.com/.../ux_wizards.html
RE: Navigate bwtween 3 pages with "next" button

Mathieu Drouin — Sat, 30 Sep 2023 11:54:20 GMT
a!localVariables(
  local!pages: {
    a!map(
      name: "Customers Details",
      icon: "user-circle"
    ),
    a!map(name: "Request Details", icon: "tasks"),
    a!map(name: "Attachments", icon: "file-upload")
  },
  local!currentPage: 1,
  {
    a!richTextDisplayField(
      label: "Initiate ",
      labelPosition: "COLLAPSED",
      value: {
        a!richTextItem(
          text: { "Initiate Document Request" },
          color: "#000000",
          style: { "STRONG" }
        )
      }
    ),
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
            a!sideBySideLayout(
              items: {
                a!forEach(
                  items: local!pages,
                  expression: a!sideBySideItem(
                    item: a!stampField(
                      icon: fv!item.icon,
                      size: "SMALL",
                      backgroundColor: if(
                        local!currentPage = fv!index,
                        "ACCENT",
                        "TRANSPARENT"
                      )
                    )
                  )
                )
              },
              spacing: "DENSE",
              stackWhen: {
                "DESKTOP_WIDE",
                "DESKTOP",
                "DESKTOP_NARROW",
                "TABLET_LANDSCAPE",
                "TABLET_PORTRAIT"
              }
            )
          },
          width: "EXTRA_NARROW"
        ),
        a!columnLayout(
          contents: {
            choose(
              local!currentPage,
              a!sectionLayout(
                label: index(local!pages, local!currentPage).name,
                contents: {
                  a!richTextDisplayField(value: a!richTextItem(text: "Page 1"))
                }
              ),
              a!sectionLayout(
                label: index(local!pages, local!currentPage).name,
                contents: {
                  a!richTextDisplayField(value: a!richTextItem(text: "Page 2"))
                }
              ),
              a!sectionLayout(
                label: index(local!pages, local!currentPage).name,
                contents: {
                  a!richTextDisplayField(value: a!richTextItem(text: "Page 3"))
                }
              )
            )
          }
        )
      }
    ),
    a!columnsLayout(
      columns: {
        a!columnLayout(
          contents: {
            a!buttonLayout(
              primaryButtons: {
                a!buttonWidget(
                  label: "next",
                  icon: "angle-right",
                  iconPosition: "END",
                  style: "NORMAL",
                  saveInto: {
                    a!save(local!currentPage, local!currentPage + 1)
                  },
                  validate: true,
                  showWhen: local!currentPage < length(local!pages)
                ),
                a!buttonWidget(
                  label: "submit",
                  icon: "check",
                  iconPosition: "END",
                  style: "NORMAL",
                  submit: true,
                  validate: true,
                  showWhen: local!currentPage = length(local!pages)
                )
              },
              secondaryButtons: {
                a!buttonWidget(
                  label: "Cancel",
                  style: "NORMAL",
                  submit: true,
                  validate: false
                ),
                a!buttonWidget(
                  label: "Back",
                  icon: "angle-left",
                  style: "NORMAL",
                  saveInto: {
                    a!save(local!currentPage, local!currentPage - 1)
                  },
                  validate: false,
                  showWhen: local!currentPage > 1
                )
              }
            )
          }
        )
      }
    )
  }
)
RE: Navigate bwtween 3 pages with "next" button

munagad4627 — Sat, 30 Sep 2023 11:45:33 GMT
Hi Shayna,
Once Remove line 137 and try moving to next page