首页 文章

$ _POST数据没有通过AJAX传递给我在Wordpress中的函数

提问于
浏览 次
1

我在Wordpress中创建了一个AJAX函数 . 在表单提交时调用该函数 . 该函数已运行，但未收到我提交的任何表单数据 . 我错过了什么？

PHP函数

我在这里添加了PHP函数，通过AJAX成功调用 . 此表单成功创建了一个新用户，但仅在我手动创建变量时（例如，请参阅$ new_user_data ['user_login'] ='This Text Works';） . 由于某种原因，$ _POST数据没有进入该函数 .

add_action("wp_ajax_register_user", __NAMESPACE__ . "\\register_user");
add_action("wp_ajax_nopriv_register_user", __NAMESPACE__ . "\\register_user");

function register_user() {

  // NONCE VERIFICATION
  if ( !wp_verify_nonce( $_REQUEST['nonce'], "rtr_register_nonce")) {
  exit("Oops! This is embarassing!");

  }

 // Get all post data for the user.

 $new_user_data = array();
 $new_user_data['first_name'] = sanitize_text_field($_POST['first-name']);
 $new_user_data['last_name'] = sanitize_text_field($_POST['last-name']);
 $new_user_data['user_email'] = $_POST['email'];
 $new_user_data['user_pass'] = sanitize_text_field($_POST['password']);

 $new_user_data['user_login'] = 'This Text Works';
 $new_user_data['role'] = 'subscriber';

 // Create the User
 $registered_user = wp_insert_user( $new_user_data );


 $result['user'] = $registered_user;

 // AJAX CHECK
 if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
  $result = json_encode($result);
  echo $result;

} else {

  header("Location: ".$_SERVER["HTTP_REFERER"]);

}

die();


}

JQuery

function registerUser(){

      var nonce = $('#regForm').attr("data-nonce");
      var formData = $('#regForm').serialize();

      $.ajax({
        url: rtr_register_user.ajaxUrl,
        type: 'post',
        dataType: 'json',
        data : {action: 'register_user', nonce: nonce, formData: formData},
        success: function (response) {
          console.log(response);
          $('#regForm').html('Your form has been submitted successfully');
        },


      });

    }

    function nextPrev(n) {
      // This function will figure out which tab to display
      var x = document.getElementsByClassName("form-tab");
      // Exit the function if any field in the current tab is invalid:
      if (n === 1 && !validateForm()) {
        return false;
      }
      // Hide the current tab:
      x[currentTab].style.display = "none";
      // Increase or decrease the current tab by 1:
      currentTab = currentTab + n;
      // if you have reached the end of the form... :
      if (currentTab >= x.length) {
        //...the form gets submitted:
        //document.getElementById("regForm").submit();
        registerUser();
        return false;
      }
      // Otherwise, display the correct tab:
      showTab(currentTab);
    }

    $('#nextBtn').click(function () {
      nextPrev(1);
    });

    $('#prevBtn').click(function () {
      nextPrev(-1);
    });

表格

<?php

$nonce = wp_create_nonce("rtr_register_nonce");
$link = admin_url('admin-ajax.php?action=register_user&nonce='.$nonce);

?>

<form id="regForm" <?php echo 'data-nonce="' . $nonce . '"'; ?>   action="<?php echo $link; ?>" method="post" enctype="multipart/form-data">>

<div class="my-3 text-center">
<span class="form-step">1</span>
<span class="form-step">2</span>
</div>
<div class="form-tab">
<p><input name="first-name" placeholder="First Name" oninput="this.className = ''"></p>
<p><input name="last-name" placeholder="Last Name" oninput="this.className = ''"></p>
<p><input name="dob" type="date" oninput="this.className = ''"></p>
</div>

<div class="form-tab">
<p><input name="email" type="email" placeholder="Email" oninput="this.className = ''"></p>
<p><input name="password" type="password" placeholder="Password" oninput="this.className = ''"></p>
</div>

<div style="overflow:auto;">
<div style="float:right;">
<button type="button" class="btn btn-brand" id="prevBtn">Previous</button>
<button type="button" class="btn btn-brand" id="nextBtn">Next</button>
</div>
</div>

</form>
php jquery ajax wordpress

4 回答

  • 1

    似乎你没有触发 registerUser() 检查以下脚本对我来说工作正常

    jQuery(document).ready(function($) {
    jQuery('body').on('click', '#nextBtn', function() {
            registerUser();
        });
});

function registerUser(){

    var nonce = jQuery('#regForm').attr("data-nonce");
    var formData = jQuery('#regForm').serialize();

    jQuery.ajax({
        url: ajaxurl,
        type: 'post',
        dataType: 'json',
        data : {action: 'register_user', nonce: nonce, formData: formData},
        success: function (response) {
          console.log(response);
          $('#regForm').html('Your form has been submitted successfully');
        },

    });
}
    回复于
  • 0
    回复于
  • 0

    “user_login”是用户的用户名，所以它可能也不接受空间 .

    另见WP Insert Post

    请尝试传递一些用户名，例如“custom_user”，然后查看结果 .

    希望这可行 .

    回复于
  • 0

    好的，这里的每个人都有点帮助 . 但是，是的，我正确地调用了AJAX，但实际上没有提交表单 . 我在表单中添加了一个.on（submit），然后在表单中添加了一个监听器来执行提交时的AJAX调用 . 这是以下修正案 .

    function nextPrev(n) {

    var x = document.getElementsByClassName("form-tab");

        if (n === 1 && !validateForm()) {
          return false;
        }

        x[currentTab].style.display = "none";

        currentTab = currentTab + n;

        if (currentTab >= x.length) {

        // ADDED THIS SUBMIT() HERE
          document.getElementById("regForm").submit();
          return false;
        }
        // Otherwise, display the correct tab:
        showTab(currentTab);
      }


      // ADDED AN EVENT LISTENER TO TRIGGER THE AJAX CALL HERE
      $('#regForm').on('submit', function () {

          var nonce = $('#regForm').attr("data-nonce");
          var formData = $('#regForm').serialize();

          $.ajax({
            url: rtr_register_user.ajaxUrl,
            type: 'post',
            dataType: 'json',
            data: {
              action: 'register_user',
              nonce: nonce,
              formData: formData
            },
            success: function (response) {
              console.log(response);
              $('#regForm').html('Your form has been submitted successfully');
            },


          });

        });
    回复于

相关问题