Форма Ajax не получает ответ от обработчика формы PHP - PullRequest
Новая
       9

Форма Ajax не получает ответ от обработчика формы PHP

1 голос
/ 16 января 2020

У меня есть форма Ajax / PHP, которая отлично работала, когда я создавал собственный сайт AMP. Ответные сообщения формы обрабатывались с помощью компонента AMP Mustache.

Я заменил компоненты AMP, поскольку я больше не использую AMP, и теперь у меня возникают проблемы с получением ответа от моего обработчика форм.

Вот моя HTML форма:

Я опущу несколько полей для краткости. Например, спам-поля для MailChimp. 

<form 
    action="<?php echo get_template_directory_uri(); ?>/mailchimp-post.php"
    method="post"
    id="subscriber_form"
    name="mc-embedded-subscribe-form"
    class="validate"
    target="_top">

    <input 
        type="text" 
        value="" 
        name="name" 
        id="name"
        placeholder="first name" required>

    <input
        type="email"
        value=""
        name="email"
        id="email"
        placeholder="email address"
        required>

    <input 
        type="submit" 
        value="<?php the_field('button_label'); ?>" 
        name="subscribe" 
        id="mc-embedded-subscribe" 
        class="button">
</form>

Вот моя отправка формы JavaScript: 

jQuery(document).ready(function($) {
  var $form = $('#subscriber_form')

  if ($form.length > 0) {
    $('form input[type="submit"]').on('click', function (event) {
      if (event) event.preventDefault()
      register($form)
    })
  }


  function register($form) {
    // Set the submit button text to "sending..."
    $('#mc-embedded-subscribe').val('sending...');

    $.ajax({
      type: $form.attr('method'),
      url: $form.attr('action'),
      data: $form.serialize(),
      cache: false,
      dataType: 'json',
      error: function (err) { alert('Could not connect to the registration server. Please try again later.') },
      success: function (data) {
        // Reset the submit button to "subscribe"
        $('#mc-embedded-subscribe').val('subscribe');

        if (data.status === 'success') { 
          // Do things upon success
          alert('success');
        } else { 
          // Something went wrong, do something to notify the user.
          alert('error');
        }
      }
    })
  };
});

* А вот моя форма PHP обработчик:

Этот обработчик формы использует оболочку PHP для отправки данных подписчика в MailChimp через их API. Эта часть кода такая же, как и при работе на сайте AMP. И AMP не имеет ничего общего с отправкой этих данных. Так что это действительно не должно быть проблемой. 

<?php
require 'vendor/autoload.php';
use \DrewM\MailChimp\MailChimp;
use \DrewM\MailChimp\Batch;

if (!empty($_POST)) {
  $MailChimp = new MailChimp('XXX');

  $list_id = 'XXX';
  $name = isset($_POST['name']) ? $_POST['name'] : '';
  $email = isset($_POST['email']) ? $_POST['email'] : '';
  $interestID = isset($_POST['interestID']) ? $_POST['interestID'] : '';
  $interestLabel = isset($_POST['interestLabel']) ? $_POST['interestLabel'] : '';
  $source = isset($_POST['source']) ? $_POST['source'] : '';
  $subscriber_hash = $MailChimp->subscriberHash($email);

  $subscribe = $MailChimp->post("lists/$list_id/members", [
    'merge_fields'  => ['FNAME'=>$name, 'MMERGE22'   => $source],
    'email_address' => $email,
    'status'        => 'subscribed'
  ]);

  if ( isset($_POST['interestID']) ) {
    $update= $MailChimp->patch("lists/$list_id/members/$subscriber_hash", [
      'email_address' => $email,
      'status'        => 'subscribed',
      'interests'    => [$interestID => true],
    ]);
  }

  if ($MailChimp->success()) {

    $success = array(
      "status" => "success",
      "message" => "Yay! You're subscribed!"
    );

    echo json_encode($success);


  } else {

    $error = array(
      "status" => "error",
      "message" => "Oh no! Something went wrong"
    );

    echo json_encode($error);
  }
}

Если я закомментирую строку event.preventDefault(), чтобы убедиться, что браузер следует за действием формы для обработчика формы PHP, я вижу ответ: 

{"status":"success","message":"Yay! You're subscribed!"}

Когда я отправляю форму, я получаю сообщение об ошибке, что data.status имеет значение null.

сами данные также равны нулю.

...