How can I show spinner on a button after clicking, disabled the button after clicking? I am using Django templates. I do not want to use jQuery at all. Looked at many other posts, most of them depend on jQuery.

<link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}">
<script src="{% static 'js/bootstrap.bundle.min.js' %}"></script>

Template submit button

  <!-- Submit button -->
  <div class="d-grid gap-2 col-6 mx-auto">
    <input type="submit" value="Sign in" class="btn btn-primary btn-block mb-4" />
  </div>

Bootstrap example

<button class="btn" type="button"> 
    <span class="spinner-border spinner-border-sm" 
        role="status"></span> 
    Loading... 
</button>