Здравствуйте при отправке формы с использование ajax перезагружается страница почему так происходит подскажите ?
<form name="form" id="form">
<input type="text" name="inputname" id="name" placeholder="Введите Имя..." required="required">
<input type="email" name="inputemail" id="email" placeholder="Введите Эл.почту..." required="required">
<input type="submit" id="send" value="Отправить">
</form>
var inputName = document.querySelector('#name');
var inputEmail = document.querySelector('#email');
var formSend = document.querySelector('#send');
formSend.addEventListener('click', function() {
var params = 'name=' + inputName.value + '&' + 'email=' + inputEmail.value;
formAjax(params);
});
var formAjax = function(params) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
alert(innerHTML = xhr.responseText);
}
}
xhr.open('POST', 'mail.php');
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.send(params);
}
<?php
$name = trim($_POST['name']);
$email = trim($_POST['email']);
if ($name == '' || $email == '') {
echo 'Заполните все поля';
}
elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
echo 'Введите коректные email';
}
else {
file_put_contents('app.txt', "$name $email \n", FILE_APPEND);
echo 'Спасибо';
}