时间戳

首页 > 解决方案 > 使用jQuery ajax将数据从表单发送到电子邮件并通过传递POST变量重定向到另一个页面不起作用

php - 使用jQuery ajax将数据从表单发送到电子邮件并通过传递POST变量重定向到另一个页面不起作用

问题描述

我在 Wordpress 中有自己的表单，在填写并单击提交后，该表单会重定向到包含此表单中的感谢和数据的页面。同时，但在重定向之前，表单中的相同数据会发送到用户和管理员电子邮件。整个过程的步骤如下。

  1. jQuery Validate 中的表单验证
  2. 使用 jQuery ajax 将数据从表单发送到电子邮件
  3. 重定向到感谢您的页面，并使用 POST 方法（jQuery + PHP）将变量从表单发送到此页面。

jQuery代码：

// validation
  $('#registration_form').validate({
    rules: {
      training_name: "required",
      training_place: "required",
      training_date: "required",
      participants_number: {
        required: true,
        range: [0,100]
      },
    (...) // etc 
  });



// jQuery ajax email sending
 $('#registration_form').on('submit', function(e) {
    // e.preventDefault();
    if ($(this).valid()) {
      let formData = $(this).serialize();
      $.ajax({
        url: ajax.url,
        type: 'POST',
        cache: false,
        async: true,
        xhrFields: {
          withCredentials: true
        },
        data: { 
          action: 'registerFormSendEmail', 
          form_data: formData
        },
        success: function(res) {
          // console.log(res);
        }
      });
      // return false;
    }
  });

在 html 表单代码中，我有带有 POST 变量的“感谢页面”的永久链接的操作名称。问题是有时使用 POST 变量发送电子邮件和重定向有效，有时则无效。大多数情况下，它在 Safari 上不起作用。有人知道为什么以及我做错了什么？

标签： phpjqueryajaxwordpress

解决方案

我设法解决了这个问题。后来发现电子邮件也没有在 Safari 以外的浏览器中发送。问题是有时网站重定向的速度比使用 Ajax 发送的电子邮件要快（这可能取决于 Internet 连接的速度）。我使用了.when()和.then()函数。我修改了 ajax 函数，使表单数据首先必须成功发送到电子邮件，然后提交表单并重定向到“谢谢”页面。

$('#submit_registration').on('click', function(e) {
    e.preventDefault();
    if ($('#registration_form').valid()) {
      let formData = $('#registration_form').serialize();
      var checkEmailSent;
      $.when(
        $.ajax({
          url: ajax.url,
          type: 'POST',
          dataType: 'JSON',
          cache: false,
          data: { 
            action: 'registerFormSendEmail', 
            form_data: formData,
          },
          success: function(res) {
            console.log(res);
            if (res !== 'sent') {
              alert('Error in sending e-mail.');
              checkEmailSent = false;
            }
          }
        })
      ).then(function() {
        if (checkEmailSent == false) {
          return false;
        } else {
          $('#registration_form').submit();
        }
      });
    }
  });

推荐阅读