Bootstrap 5 Pro: write code that launches a Toast if form Validation finds error
Budget: $10 – $30 USD
We have downloaded and begun using Bootstrap 5 for a website. Using all Bootstrap 5 capabilities, we are validating our forms and Bootstrap 5 is testing all required fields properly.
However, Bootstrap 5 does not give an alert, nor does it focus on the first error field on the page if there is an error found on the page when submitting the form. Nothing happens after the submit button is clicked to lete the user know there is an error above. So, if the form is very long... the user has to think about scrolling up to find out if there was an error.
We would like for a Bootstrap 5 Toast to appear in the center of the page... if an error is found on submit, so that the user knows there is still work to do on the page.
We have not customized anything, so we need help with this behavior with a default version of Bootstrap 5. Here are pages dealing with the issue:
Validation: Bootstrap v5.1
https://getbootstrap.com/docs/5.1/forms/validation
Toasts: Bootstrap v5.1
https://getbootstrap.com/docs/5.1/components/toasts
If you can tell us where to insert your code into our instance of Bootstrap 5, so that if there is an error found on validation after a submit, a toast appears in the center of the page... this project is for you. Thank you!
However, Bootstrap 5 does not give an alert, nor does it focus on the first error field on the page if there is an error found on the page when submitting the form. Nothing happens after the submit button is clicked to lete the user know there is an error above. So, if the form is very long... the user has to think about scrolling up to find out if there was an error.
We would like for a Bootstrap 5 Toast to appear in the center of the page... if an error is found on submit, so that the user knows there is still work to do on the page.
We have not customized anything, so we need help with this behavior with a default version of Bootstrap 5. Here are pages dealing with the issue:
Validation: Bootstrap v5.1
https://getbootstrap.com/docs/5.1/forms/validation
Toasts: Bootstrap v5.1
https://getbootstrap.com/docs/5.1/components/toasts
If you can tell us where to insert your code into our instance of Bootstrap 5, so that if there is an error found on validation after a submit, a toast appears in the center of the page... this project is for you. Thank you!