Buttons that toggle state of other buttons

Currently have 3 buttons that show and hide 3 separate sections of code. 

If I click button 1 I want to disable button 1 and leave button 2 and 3 enabled. 

If I click button 2 after clicking button 1 I want button 1 to reset and for button 2 to be disabled. 

Appreciate the help in advance!

a!localVariables(
local!buttonTierOne: false(),
local!buttonTierTwo: false(),
local!buttonTierThree: false(),
local!buttonRest: true(),

a!formLayout(
label: "Label",
a!sectionLayout(
contents: {
a!sectionLayout(
label: "",
contents: {
a!columnsLayout(
columns: {
a!columnLayout(
contents: {
a!boxLayout(
label: "",
contents: {
a!richTextDisplayField(
labelPosition: "COLLAPSED",
value: {
a!richTextItem(
text: {
"Submit Tier 1 "
},
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(
text: {
"Service Output Form"
},
size: "MEDIUM_PLUS"
)
},
align: "CENTER"
),
a!buttonArrayLayout(
buttons: {
a!buttonWidget(
label: "Start",
icon: "file-text-o",
value: true(),
saveInto: {local!buttonTierOne, a!save(local!buttonRest,false())},
submit: false(),
disabled: if (local!buttonTierOne, true, false), style: "PRIMARY",
validate: true()
)
},
align: "CENTER"
)
},
style: "ACCENT",
marginBelow: "STANDARD"
)
}
),
a!columnLayout(
contents: {
a!boxLayout(
label: "",
contents: {
a!richTextDisplayField(
labelPosition: "COLLAPSED",
value: {
a!richTextItem(
text: {
"Submit Tier 2 "
},
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(
text: {
"Additional Request Form"
},
size: "MEDIUM_PLUS"
)
},
align: "CENTER"
),
a!buttonArrayLayout(
buttons: {
a!buttonWidget(
label: "Start",
icon: "file-text-o",
value: true(),
saveInto: local!buttonTierTwo,
submit: false(),
style: "PRIMARY",
validate: true()
)
},
align: "CENTER"
)
},
style: "ACCENT",
marginBelow: "STANDARD"
)
}
),
a!columnLayout(
contents: {
a!boxLayout(
label: "",
contents: {
a!richTextDisplayField(
labelPosition: "COLLAPSED",
value: {
a!richTextItem(
text: {
"Submit Tier 3"
},
size: "MEDIUM_PLUS"
),
char(10),
a!richTextItem(
text: {
"Service output Form"
},
size: "MEDIUM_PLUS"
)
},
align: "CENTER"
),
a!buttonArrayLayout(
buttons: {
a!buttonWidget(
label: "Start",
icon: "file-text-o",
value: true(),
saveInto: local!buttonTierThree,
submit: false(),
style: "PRIMARY",
disabled: local!buttonTierThree,
validate: true()
)
},
align: "CENTER"
)
},
style: "ACCENT",
marginBelow: "STANDARD"
)
}
)
}
)
},
divider: "BELOW",
dividerWeight: "MEDIUM"
)
}
),

  Discussion posts and replies are publicly visible

  • Hi there,

    This should help. 

    a!localVariables(
      local!buttonTierOne: false(),
      local!buttonTierTwo: false(),
      local!buttonTierThree: false(),
      local!buttonRest: true(),
      a!formLayout(
        label: "Label",
        contents: a!sectionLayout(
          contents: {
            a!sectionLayout(
              label: "",
              contents: {
                a!columnsLayout(
                  columns: {
                    a!columnLayout(
                      contents: {
                        a!boxLayout(
                          label: "",
                          contents: {
                            a!richTextDisplayField(
                              labelPosition: "COLLAPSED",
                              value: {
                                a!richTextItem(
                                  text: { "Submit Tier 1 " },
                                  size: "MEDIUM_PLUS"
                                ),
                                char(10),
                                a!richTextItem(
                                  text: { "Service Output Form" },
                                  size: "MEDIUM_PLUS"
                                )
                              },
                              align: "CENTER"
                            ),
                            a!buttonArrayLayout(
                              buttons: {
                                a!buttonWidget(
                                  label: "Start",
                                  icon: "file-text-o",
                                  value: true(),
                                  saveInto: {
                                    local!buttonTierOne,
                                    a!save(local!buttonRest, false())
                                  },
                                  submit: false(),
                                  disabled: if(local!buttonTierOne, true, false),
                                  style: "PRIMARY",
                                  validate: true()
                                )
                              },
                              align: "CENTER"
                            )
                          },
                          style: "ACCENT",
                          marginBelow: "STANDARD"
                        )
                      }
                    ),
                    a!columnLayout(
                      contents: {
                        a!boxLayout(
                          label: "",
                          contents: {
                            a!richTextDisplayField(
                              labelPosition: "COLLAPSED",
                              value: {
                                a!richTextItem(
                                  text: { "Submit Tier 2 " },
                                  size: "MEDIUM_PLUS"
                                ),
                                char(10),
                                a!richTextItem(
                                  text: { "Additional Request Form" },
                                  size: "MEDIUM_PLUS"
                                )
                              },
                              align: "CENTER"
                            ),
                            a!buttonArrayLayout(
                              buttons: {
                                a!buttonWidget(
                                  label: "Start",
                                  icon: "file-text-o",
                                  value: true(),
                                  saveInto: {
                                    local!buttonTierTwo,
                                    a!save(
                                      local!buttonTierOne,
                                      false
                                    )
                                  },
                                  submit: false(),
                                  style: "PRIMARY",
                                  validate: true(),
                                  disabled: local!buttonTierTwo
                                )
                              },
                              align: "CENTER"
                            )
                          },
                          style: "ACCENT",
                          marginBelow: "STANDARD"
                        )
                      }
                    ),
                    a!columnLayout(
                      contents: {
                        a!boxLayout(
                          label: "",
                          contents: {
                            a!richTextDisplayField(
                              labelPosition: "COLLAPSED",
                              value: {
                                a!richTextItem(
                                  text: { "Submit Tier 3" },
                                  size: "MEDIUM_PLUS"
                                ),
                                char(10),
                                a!richTextItem(
                                  text: { "Service output Form" },
                                  size: "MEDIUM_PLUS"
                                )
                              },
                              align: "CENTER"
                            ),
                            a!buttonArrayLayout(
                              buttons: {
                                a!buttonWidget(
                                  label: "Start",
                                  icon: "file-text-o",
                                  value: true(),
                                  saveInto: {
                                    local!buttonTierThree,
                                    a!save(
                                      {
                                        local!buttonTierOne,
                                        local!buttonTierTwo
                                      },
                                      false
                                    )
                                  },
                                  submit: false(),
                                  style: "PRIMARY",
                                  validate: true(),
                                  disabled: local!buttonTierThree
                                )
                              },
                              align: "CENTER"
                            )
                          },
                          style: "ACCENT",
                          marginBelow: "STANDARD"
                        )
                      }
                    )
                  }
                )
              },
              divider: "BELOW",
              dividerWeight: "MEDIUM"
            )
          }
        )
      )
    )