Search code examples
javascripthtmlbootstrap-5express-handlebars

Button to reload page does not reload page

I was trying to press a button to reload the page but it doesn't work and I don't know why

I'm using handlebars, so in theory all this code down here is inside a <body>

It sends the "POST" and everything okay, the only thing that does not run is the script

As a little relevant information, I am using Bootstrap 5.

<script>
const reload = document.getElementById('reload');

reload.addEventListener('click', _ => { 
    window.location.reload();
});
</script>

<div class="Things with little reference">

. . .

   <form action="/dashboard/" method="POST">
      <div class="form-group">
         <button id="reload" class="btn btn-success">ye!</button>
      </div>
   </form>
Solution

  • The default type of button is "submit" which will submit the form.

    for this case, you should change the button type to "button" or use preventDefault to stop the default behavior of the button clicked.

    change the button type to "button"

      <button type="button" id="reload" class="btn btn-success">ye!</button>

    or use preventDefault

    reload.addEventListener('click', e => { 
    e.preventDefault()
    window.location.reload();
});