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

时间:2018-01-02 12:00:53

标签: php jquery ajax wordpress

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

PHP函数

我在这里添加了PHP函数,通过AJAX成功调用。此表单成功创建了一个新用户,但仅在我手动创建变量时(例如,请参阅$ new_user_data [' user_login'] ='此Text Works&#39 ;;)。由于某种原因,$ _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>

4 个答案:

答案 0 :(得分: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');
        },

    });
}

答案 1 :(得分:0)

答案 2 :(得分:0)

&#34; user_login&#34;是用户的用户名,所以它可能也不接受空间。

另见WP Insert Post

请尝试传递一些用户名,例如&#34; custom_user&#34;并看到结果。

希望这可行。

答案 3 :(得分: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');
            },


          });

        });