Why doesn't the form submit via pure JS?

M

msdoc112021-07-20 21:53:05

PHP

msdoc11, 2021-07-20 21:53:05

Hello, I have a php form code

<?php
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && !empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
  $post = (!empty($_POST)) ? true : false;

if($post)
{
$mail = htmlspecialchars($_POST['mail']);
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$error = '';


// Проверка телефона
function ValidateTel($valueTel)
{
$regexTel = "/^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/";
if($valueTel == "") {
return false;
} else {
$string = preg_replace($regexTel, "", $valueTel);
}
return empty($string) ? true : false;
}
if(!$name)
{
$error .= "Введите имя<br />";
}
}
if(!$email)
{
$error .= "Введите ваш телефон<br />";
}
if(!$error)

{

if (empty($mail)){ 
$to = "<[email protected]>";
$email = $_POST['email'];
$subjects = "Заявка с сайта";
$message = '
<html>
<body>
<center>	
<table border=1 cellpadding=6 cellspacing=0 width=90% bordercolor="#DBDBDB">
 <tr><td colspan=2 align=center bgcolor="#E4E4E4"><b>Информация</b></td></tr>
 <tr>
  <td><b>Имя</b></td>
  <td>'.$name.'</td>
 </tr>
 <tr>
  <td><b>Телефон</b></td>
  <td><a href="mailto:'.$email.'">'.$email.'</a></td>
 </tr>
</table>
</center>	
</body>
</html>'; 
$headers  = "Content-type: text/html; charset=utf-8\r\n";
$headers .= "From: Тестовое письмо <[email protected]>\r\n";
$result = mail($to, $subjects, $message, $headers);
} else exit ;


if($result)
{
echo 'OK';
}

}
else
{
echo '<div class="notification_error">'.$error.'</div>';
}
} else {
  echo '<div class="notification_error">Спам</div>';
}
?>

And a pure js handler

var form = document.querySelector('#myForm');

form.addEventListener('submit', function(evt) {
  evt.preventDefault();

  var formData = {
    name: document.querySelector('input[name="name"]').value,
    mail: document.querySelector('input[name="mail"]').value,
    email: document.querySelector('input[name="email"]').value
  };

  var request = new XMLHttpRequest();

  request.addEventListener('load', function() {
    // В этой части кода можно обрабатывать ответ от сервера
    console.log(request.response);
    alert('Ваша заявка успешно отправлена!');
    form.innerHTML = '<h2>Спасибо за заявку!</h2>';
  });

  request.open('POST', '/send.php', true);
  request.send('name=' + encodeURIComponent(formData.name) + '&email=' + encodeURIComponent(formData.email) + '&mail=' + encodeURIComponent(formData.mail));
});

Writes that everything was successfully sent, but there is a spam error in the console. On Jquery everything works fine

And just in case the html code

<form class="my-form" id="myForm" method="post" action="send.php">
  <p>
    Ваше имя:
    <input type="text" placeholder="Ваше имя" name="name" required>
     <input type="text" placeholder="Ваш email" name="mail" hidden>
  </p>
  <p>
    Ваш email:
    <input type="text" placeholder="Ваше email" name="email" required>
  </p>
  <button type="submit">Отправить</button>
</form>

Reply

Answer the question

In order to leave comments, you need to log in

[[+comments_count]] answer(s)

G

galaxy, 2021-07-21
@galaxy

jquery inserts title X-Requested-With: XMLHttpRequestbut you don't