Overview
This article explains how to implement a solution using Auth0 Forms with multiple buttons in a form. In the onContinuePostLogin function of the Action, the admin needs to access which button the user clicked.
Detailed use case:
- A form is rendered after providing the valid credentials on the login page.
- The form has a single view with multiple buttons the user can click.
- Once the user clicks on any one of the buttons, exports.onContinuePostLogin is triggered in the post-login action.
- In exports.onContinuePostLogin function we want to know which button the user has clicked.
Applies To
- Forms
- Post Login Action
Solution
This use case can be implemented with the Jump Buttons and a separate flow for each button, with the “Store shared variable” Action storing the same variable (the variable name can be arbitrary). Here is a screenshot showing a solution for two buttons; however, the same idea can be extended to any number of buttons.
The “Stored Shared variable” action stores an attribute named buttonSelection . This action in the Button-1 Flow sets this variable to FirstButton. A similar action in Button-2 Flow sets the same attribute to SecondButton.
In the onContinuePostLogin function, the attribute is available with
event.prompt?.vars?.buttonSelection
and can be used to implement a custom business logic.
exports.onContinuePostLogin = async (event, api) => {
console.log(event.prompt?.vars?.buttonSelection);
if (event.prompt?.vars?.buttonSelection === "FirstButton") {
// First button clicked
} else if (event.prompt?.vars?.buttonSelection === "SecondButton") {
// Second button clicked
} else {
// This use case should not happen.
}
};