Confirm that an application was submitted
<GoabText as="h1" mt="none">You have completed the application</GoabText>
<GoabxCallout type="success" heading="Your application was successful">
<GoabText mt="none" mb="m">You will receive a copy of the confirmation to the email person@email.com</GoabText>
<GoabText mt="none" mb="none">Confirmation number: <strong>1234ABC</strong></GoabText>
</GoabxCallout>
<GoabText as="h2" mt="xl" mb="m">Go back to the dashboard, or direct your user somewhere else useful.</GoabText>
<GoabText>
Other information about what was just completed, other tertiary information, and/or contact information.
<br />
Phone: <a href="tel:7801234567">780 123 4567</a>
<br />
Email: <a href="mailto:information@gov.ab.ca">information@gov.ab.ca</a>
</GoabText>
<GoabButtonGroup alignment="start" mt="2xl">
<GoabxButton type="primary">Go to application</GoabxButton>
<GoabxButton type="secondary">Back to dashboard</GoabxButton>
</GoabButtonGroup><goab-text as="h1" mt="none">You have completed the application</goab-text>
<goabx-callout type="success" heading="Your application was successful">
<goab-text mt="none" mb="m">You will receive a copy of the confirmation to the email person@email.com</goab-text>
<goab-text mt="none" mb="none">Confirmation number: <strong>1234ABC</strong></goab-text>
</goabx-callout>
<goab-text as="h2" mt="xl" mb="m">Go back to the dashboard, or direct your user somewhere else useful.</goab-text>
<goab-text>Other information about what was just completed, other tertiary information, and/or contact information.
<br/>
Phone: <a href="tel:7801234567">780 123 4567</a>
<br/>
Email: <a href="mailto:information@gov.ab.ca">information@gov.ab.ca</a>
</goab-text>
<goab-button-group alignment="start" mt="2xl">
<goabx-button type="primary">Go to application</goabx-button>
<goabx-button type="secondary">Back to dashboard</goabx-button>
</goab-button-group><goa-text as="h1" mt="none">You have completed the application</goa-text>
<goa-callout version="2" type="success" heading="Your application was successful">
<goa-text mt="none" mb="m">You will receive a copy of the confirmation to the email person@email.com</goa-text>
<goa-text mt="none" mb="none">Confirmation number: <strong>1234ABC</strong></goa-text>
</goa-callout>
<goa-text as="h2" mt="xl" mb="m">Go back to the dashboard, or direct your user somewhere else useful.</goa-text>
<goa-text>Other information about what was just completed, other tertiary information, and/or contact information.
<br>
Phone: <a href="tel:7801234567">780 123 4567</a>
<br>
Email: <a href="mailto:information@gov.ab.ca">information@gov.ab.ca</a>
</goa-text>
<goa-button-group alignment="start" mt="2xl">
<goa-button version="2" type="primary">Go to application</goa-button>
<goa-button version="2" type="secondary">Back to dashboard</goa-button>
</goa-button-group>Display a confirmation screen to indicate successful application submission.
When to use
Use this pattern when:
- A user has successfully completed an application or form
- You need to confirm the submission was received
- Users need a confirmation number for their records
- You want to provide next steps after submission
Considerations
- Use a success callout to clearly indicate success
- Include a confirmation number users can reference later
- Mention where a confirmation email will be sent
- Provide clear next steps and navigation options
- Include contact information for questions