Ajax 不提交 WordPress 表单答案

【问题标题】：Ajax Not Submitting WordPress FormAjax 不提交 WordPress 表单
【发布时间】：2018-09-21 02:18:38
【问题描述】：

所以，不太确定我做错了什么。我的表单在没有我的 Ajax 的情况下可以很好地提交到我的数据库，但使用我的 Ajax 则不能。此外，如果您对 dataString 变量执行 console.log，它会填充值。因此，它将成功提交并触发成功函数，但由于某种原因，数据永远不会进入我的 php 函数，因为我的数据库是空的。此外，控制台中没有错误，并且 ajax_url 变量工作正常。

var dataString = 'reservationName='+ resName.val() + '&reservationEmail=' + resEmail.val() + '&reservationPhone=' + resPhone.val() + '&reservationTime=' + resTime.val() + '&reservationRequests=' + resReqests.val();

            console.log(dataString);

            $.ajax({
                type: 'POST',
                url: ajax_url,
                data: {
                    'action': 'submit_reservation',
                    from: dataString
                },
                cache: false,
                success: function () {

                    $('form.reservation-form').addClass('submitted');

                    setTimeout(function () {
                        $('form.reservation-form').addClass('hide');
                    }, 400);

                    $('.thanks-message').addClass('appear');

                    resName.val('');
                    resName.removeClass('invalid');
                    resEmail.val('');
                    resEmail.removeClass('invalid');
                    resPhone.val('');
                    resPhone.removeClass('invalid');
                    resTime.val('');
                    resTime.removeClass('invalid');
                    resAS.val('');
                    resAS.removeClass('invalid');

                },
                error: function () {

                    $('form.reservation-form').addClass('submitted');

                    setTimeout(function () {
                        $('form.reservation-form').addClass('hide');
                    }, 400);

                    $('.error-message').addClass('appear');

                    resName.val('');
                    resName.removeClass('invalid');
                    resEmail.val('');
                    resEmail.removeClass('invalid');
                    resPhone.val('');
                    resPhone.removeClass('invalid');
                    resTime.val('');
                    resTime.removeClass('invalid');
                    resAS.val('');
                    resAS.removeClass('invalid');

                }
            });




 <?php

function submit_reservation() {

global $wpdb;

$name = $_POST['reservationName'];
$email = $_POST['reservationEmail'];
$phone = $_POST['reservationPhone'];
$time = $_POST['reservationTime'];
$requests = $_POST['reservationRequests'];
$filter = $_POST['reservationFilter'];
$antiSpam = $_POST['reservationAntiSpam'];

if ($antiSpam === '8') {

    $table = $wpdb->prefix . 'reservations';

    $data = array(
        'name' => $name,
        'phone' => $phone,
        'email' => $email,
        'time' => $time,
        'requests' => $requests
    );

    $format = array(
        '%s',
        '%s',
        '%s',
        '%s',
        '%s'
    );

    $wpdb->insert($table, $data, $format);

}

}

add_action('init', 'submit_reservation');
add_action('wp_ajax_submit_reservation', 'submit_reservation');
add_action('wp_ajax_nopriv_submit_reservation', 'submit_reservation');


?>

【问题讨论】：

你创建了submit_reservation函数并在上面添加了ajax动作钩子吗？
是的，先生/女士。
你能把这段代码也加在这里吗？
抱歉花了这么长时间 - 添加了我的 PHP 代码。

标签： php jquery ajax wordpress

【解决方案1】：

您的 ajax 的数据部分应该有一组键值对，其中的键与 $_POST 的键匹配。

data: {
        "action"              : "submit_reservation"
        ,"reservationName"    : "a string or variable here"
        ,"reservationEmail"   : aVariable
        ,"reservationPhone"   : anotherVariable
        ,"reservationTime"    : "a string or variable here"
        ,"reservationRequests": "a string or variable here"
        ,"reservationFilter"  : "a string or variable here"
        ,"reservationAntiSpam": "a string or variable here"
      },

【讨论】：

太棒了，几乎可以工作了！它现在只是提交了两次数据，即使添加了 return false。有什么想法吗？我还添加了 e.stopImmediatePropagation();但它并没有阻止它。
我也非常感谢您的帮助。
@valtro05 删除该函数的初始化操作挂钩。我想这就是它提交两次的原因。