Почему AJAX refre sh страница?

Question

У меня есть форма html, которая используется для входа на мой сайт. Единственная проблема в том, что он обновляет страницу, чего я не хочу. Поэтому я пытаюсь использовать вместо этого AJAX. И это не работает. Страница по-прежнему обновляется, и я не уверен, что отправляемые мной данные отправляются правильно. Мой код ниже. Что я делаю не так?

 <?php if (login_check($mysqli) == false) :  ?>
     <div id="loginform" data-iziModal-group="grupo1">
         <button data-iziModal-close class="icon-close">x</button>  <!--watch out here - JSFormat formatted the izimodal spec to have spaces in it and the button no longer worked.-->
         <header>
         <a href="" id="signin">Sign in</a>
         </header>
         <section>
         <form name="login_form" id="login_form">
         <input type="text" placeholder="Email" name="email" class="login_email" id="login_email">
         <input id="password" type="password" placeholder="Password" name="password" class="login_password">
         <footer>
         <button data-iziModal-close>Cancel</button>
         <button class="submit" data-iziModal-close onclick="hashandlogin(this.form, this.form.password);">Log in</button>
         <p style="text-align: center; color: #444; font-size: 16px; font-family: Lato; padding-top: 70px; font-weight: 500;">
        Don't have an account? <a style="font-size: 16px; font-weight: 500; font-family: Lato;" href="register.php">Register here.</a></p>
                        </footer>
                        </form>
                        </section>
                    </div>
          <script type="text/javascript">

          document.getElementById("login_form").addEventListener("submit", function (event) {
              event.preventDefault()
              console.log("defaultprevented");
          });

    function hashandlogin(a, b) {
         formhash(a, b);
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200) {
                console.log(this.responseText);
            }
        };
        xmlhttp.open("GET", "includes/process_login.php?email=" +document.getElementById("login_email").value + "&p="+document.getElementById("hashedp").value, true);
        xmlhttp.send(); 
    }

    </script>   

function formhash(a, b) {
var c = document.createElement("input");
a.appendChild(c), c.name = "p", c.type = "hidden", c.id="hashedp", c.value = hex_sha512(b.value), b.value = "", a.submit()

}

includes / process_login. php file:

<?php

include_once 'db_connect.php';
include_once 'functions.php';

sec_session_start(); // Our custom secure way of starting a PHP session.

if (isset($_POST['email'], $_POST['p'])) {
    $email = filter_input(INPUT_POST, 'email', FILTER_SANITIZE_EMAIL);
    $password = $_POST['p']; // The hashed password.

    if (login($email, $password, $mysqli) == true) {
        $_SESSION["email"] = $email;
        saveLogin($_SESSION['user_id'],$mysqli);
        echo ("something");
        // Login success
      //  header("Location: ../account.php");  I don't want the account page shown just cos user has logged in. But what should go here? If nothing or index.php then get a blank page with process_login.php as the address.
        exit();
    } else {
        // Login failed
  //      header('Location: ../login.php?error=1');
  echo ("nothing");
        exit();
    }
} else {
    // The correct POST variables were not sent to this page.
    echo ("nothing at all");
  //  header('Location: ../error.php?err=Could not process login');
    exit();
}

Answer 1

Если вы не определите type кнопки внутри <form>, то по умолчанию кнопка будет вести себя как type="submit". Вероятно, это то, что вызывает ваш refre sh.

Кроме того, <form> без определенного action примет текущую страницу как действие.

Один из способов обойти все это использовать: event.preventDefault().