AJAX отправить на php контроллер не работает в javascript

Question

Фрагмент показывает мои html и js. В моем php контроллере я просто print_r ($ _ POST), но я вижу только данные формы для myName, я не могу понять, как получить доступ к zzz

ОБНОВЛЕНИЕ: я добавил некоторый код, чтобы убедиться, что запрос на отправку завершено. Тем не менее, если я не отправлю форму, контроллер не выполнит просто запрос xhttp. Я до сих пор не могу получить данные js в php. Я мог бы создать скрытые входные данные и заполнить их из js и отправки, но это кажется уродливым. может кто-нибудь помочь?

function swagSend() {
  event.preventDefault();

  var xhttp = new XMLHttpRequest();

  xhttp.open("POST", "https://www.sustainablewestonma.org/wp-content/themes/twentytwelve-child/php/send_email.php", true);
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      console.log(xhttp.responseText);
    }
  }

  var henry = "henry"
  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhttp.send("zzz=" + henry);

  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {

      document.getElementById("myForm").submit();

    }
  }
}

<form action="https://www.sustainablewestonma.org/wp-content/themes/twentytwelve-child/php/send_email.php" method="POST" id='myForm'>

  <input type='text' name='myname'>
  <button type='submit' value='submit' onClick=swagSend();>Submit</button>

</form>

Answer 1

Если вы звоните Ajax, нет причин для отправки формы. убери это.

Если вы хотите, чтобы данные формы отправлялись в вызове Ajax, вам необходимо прочитать входные значения формы и составить список самостоятельно.

function swagSend(event) {
  event.preventDefault();

  var xhttp = new XMLHttpRequest();
  xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xhttp.open("POST", "https://www.sustainablewestonma.org/wp-content/themes/twentytwelve-child/php/send_email.php", true);
  xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
      console.log(xhttp.responseText);
    }
  }

  var henry = "henry"
  var name = encodeURIComponent(document.getElementById("myname").value)
  xhttp.send("zzz=" + henry + '&myname=' + name);
}

<form action="https://www.sustainablewestonma.org/wp-content/themes/twentytwelve-child/php/send_email.php" method="POST" id='myForm'>

  <input type='text' name='myname' id='myname'>
  <button type='submit' value='submit' onClick="swagSend(event)">Submit</button>

</form>

Answer 2

вы должны отправлять только с xhttp.send, а не дополнительно с document.getElementById ("myForm"). Submit ();