Adding form submission loading indicators
We want to add a loading indicator for the form submission of the newsletter form, contact form, and payment form, so the user can see that the browser is waiting for a response from the server. For our website, we won’t submit any forms to a server or wait for any response, so we will emulate this behavior.
Our loading indicator will simply be the spinner component of Bootstrap 5 (to be precise, the border spinner variation) replacing the text of the submit button.
The first thing we need to do is to add an id attribute to all of the submit buttons, where we want a loading indicator to be. Then, we can use those id attributes later to target the submit buttons from our JavaScript code.
This is what the updated markup for our submit buttons will look like:
part-2/chapter-9/website/index.html
<button type="submit" class="btn btn-primary" id="newsletterButton">Subscribe</button>...
