Customize action buttons (Submit, Cancel, Clear, Reset)
Amplify Studio generated forms come with three action buttons: Submit, Cancel, and Clear or Reset, depending on whether the form creates or updates a record.
Change button positions
You can choose to show the action buttons on the bottom (default), top, or top and bottom of the form.
- From Amplify Studio: Select the action buttons
- Go to Display > Position
- Select Bottom, Top, or Top & bottom
Customize label for Submit, Cancel, Clear, and Reset buttons
You can customize action button labels to better describe your form's use case, such as changing Submit
to Create note
.
- From Amplify Studio: Select the action buttons
- Go to Display > Submit button label
- Enter your custom button label
Toggle visibility for Submit, Cancel, Clear, and Reset buttons
You can customize the visibility of action buttons to better accommodate your form's use case. For example, if you show the form in a modal with an X
as a close button, you can hide the redundant Cancel
action button.
- From Amplify Studio: Select the action buttons
- Go to Display > Submit button is visible
- Enter your custom button label
If you hide all form action buttons, you can still leverage the onChange
event handler to self-manage the form lifecycle. This is useful for a form that updates data in real-time without explicit user confirmation.