title: Prevent login modal/popup form closing when there is validation error
body: <p>How do I prevent popup login form from closing after submitting it whenever there is a validation error? I'm using node.js and ejs as view engine.</p>
  <p>Login html form:</p>
  <pre><code>&lt;div class=&quot;modal&quot;&gt;
    &lt;div class=&quot;modal__box&quot;&gt;
      &lt;form id=&quot;login-form&quot; action=&quot;/auth/login&quot; method=&quot;POST&quot;&gt;
        &lt;h2&gt;Login&lt;/h2&gt;
        &lt;% errors.forEach(function(message) { %&gt;
          &lt;div class=&quot;alert alert__danger&quot;&gt;
            &lt;p&gt;&lt;%= message %&gt;&lt;/p&gt;
          &lt;/div&gt;
        &lt;% }) %&gt;
        &lt;input type=&quot;email&quot; placeholder=&quot;email&quot;&gt;
        &lt;input type=&quot;password&quot; placeholder=&quot;password&quot;&gt;
        &lt;button id=&quot;modal-submit&quot; class=&quot;btn&quot;&gt;Login&lt;/button&gt;
        &lt;span class=&quot;modal__close&quot;&gt;&lt;i class=&quot;fas fa-times&quot;&gt;&lt;/i&gt;&lt;/span&gt;
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Frontend JS code:</p>
  <pre><code>class Nav {
    constructor(){
      this.modalBtn = document.querySelector('.modal__btn')
      this.modalBg = document.querySelector('.modal')
      this.modalCloseBtn = document.querySelector('.modal__close')
      this.events()
    }
  
    events() {
      this.modalBtn.addEventListener('click', () =&gt; this.modalOpen())
  
      this.modalCloseBtn.addEventListener('click', () =&gt; this.modalClose())
    }
  
    modalOpen() {
      this.modalBg.classList.add('active')
    }
  
    modalClose() {
      this.modalBg.classList.remove('active')
    }
  }
  
  export default Nav
  </code></pre>