2016-12-28 100 views
0

我想實現一個用戶可以註冊該網站的ajax模式註冊表單。我已經設法讓登錄表單工作,但我在註冊時遇到了麻煩。我把我的登錄模板模板作爲參考。我哪裏做錯了?Ajax用戶註冊失敗提交問題

UPDATE我設法讓數據庫註冊用戶..我更新了下面的代碼。現在幾件事情。

  1. 頁面犯規重定向經註冊主頁
  2. 它沒有用戶時,我做刷新頁面
  3. 檢查phpMyAdmin的,密碼的用戶輸入是不是在數據庫中找到(記錄一個隨機的文本字符串在那裏)
  4. 當我使用隨機字符串文本或他們註冊的密碼時,登錄失敗。

我的HTML。

<div id="signup-body" class="toggleMe"> 
        <form class="form" id="signupform" role="form" name="signupform" action="" method="post"> 
         <p class="status"></p> <!-- testing the status --> 
         <div class="form-group"> 
          <label class="sr-only" for="signup-name">Username</label> 
          <input type="text" class="form-control" id="signupname" name="signup-name" placeholder="Username"> 
         </div> 
         <!-- Form Group --> 
         <div class="form-group"> 
          <label class="sr-only" for="signup-email">Email</label> 
          <input type="email" class="form-control" id="signupemail" name="signup-email" placeholder="Email"> 
         </div> 
         <div class="form-group"> 
          <label class="sr-only" for="signup-password">Password</label> 
          <input type="password" class="form-control" id="signuppassword" name="signup-password" placeholder="Password"> 
         </div> 
         <!-- Form Group --> 

         <input type="submit" class="btn btn-secondary signup-modal-button" value="Sign Up"> 
         <?php wp_nonce_field('ajax-login-nonce', 'security'); ?> 
        </form> 
       </div> 

jQuery代碼

jQuery(document).ready(function($) { 

    // Perform AJAX login on form submit 
    $('form#signupform').on('submit', function(e){ 
     $('form#signup p.status').show().text('Sending user info, please wait...'); 
     $.ajax({ 
      type: 'POST', 
      dataType: 'json', 
      url: "<?php echo admin_url('admin-ajax.php');?>", 
      data: { 
       action: 'register_user', //calls wp_ajax_nopriv_ajaxlogin 
       'username': $('form#signupform #signupname').val(), 
           'email': $('form#signupform #signupemail').val(), 
       'password': $('form#signupform #signuppassword').val(), 
       'security': $('form#signupform #security').val() }, 

      success: function(data){ 
        console.log(data); 
       $('form#signup p.status').text(data.message); 
       if (data.loggedin == true){ 
        document.location.href = ajax_login_object.redirecturl; 
       } 
      },error: function (data) { 
       console.log(data); 
      } 

     }); 
     e.preventDefault(); 
    }); 

}); 

在functions.php的

function ajax_signup_init(){ 

wp_register_script('ajax-signup-script', get_template_directory_uri() . '/assets/js/ajax-signup-script.js', array('jquery')); 
wp_enqueue_script('ajax-signup-script'); 

wp_localize_script('ajax-signup-script', 'ajax_signup_object', array(
    'ajaxurl' => admin_url('admin-ajax.php'), 
    'redirecturl' => home_url(), 
    'loadingmessage' => __('Sending user info, please wait...') 
)); 

// Enable the user with no privileges to run ajax_login() in AJAX 

} 
add_action('init', 'ajax_signup_init'); 

function ajax_signup(){ 

    // First check the nonce, if it fails the function will break 
    check_ajax_referer('ajax-login-nonce','security'); 

    // Nonce is checked, get the POST data and sign user on 
    $info = array(); 
    $info['user_login'] = $_POST['username']; 
    $info['user_email'] = $_POST['email']; 
    $info['user_password'] = $_POST['password']; 
    $info['remember'] = true; 


    $user_signup = wp_insert_user($info); 

    if (!is_wp_error($user_signup)){ 
     echo "User created : ". $user_signup; 
    } 

    die(); 
} 

add_action('wp_ajax_register_user', 'ajax_signup'); 
add_action('wp_ajax_nopriv_register_user', 'ajax_signup'); 

回答

1

您的ajax回調函數應該如下所示。

 function ajax_signup(){ 

      // First check the nonce, if it fails the function will break 
      check_ajax_referer('ajax-login-nonce','security'); 

      // Nonce is checked, get the POST data and sign user on 
      $info = array(); 
      $info['user_login'] = $_POST['username']; 
      $info['user_email'] = $_POST['email']; 
      $info['user_password'] = $_POST['password']; 
      $info['remember'] = true; 


      $user_signup = wp_insert_user($info); 

      if (!is_wp_error($user_signup)){ 
       echo json_encode(array('loggedin'=>true, 'message'=>__('Sign up successful, redirecting...'))); 
      } else { 
       echo json_encode(array('loggedin'=>false, 'message'=>__('Wrong username or password.'))); 
      } 
      wp_set_current_user($user_signup); 
      wp_set_auth_cookie($user_signup); 
      die(); 
     } 

     add_action('wp_ajax_ajax_login', 'ajax_login'); 
     add_action('wp_ajax_nopriv_ajax_login', 'ajax_login'); 

您必須在代碼中添加這兩個。

wp_set_current_user($user_signup); 
    wp_set_auth_cookie($user_signup); 
+0

謝謝,修正了它:) –

0

首先,你並不需要使用元素的完整路徑與id屬性與jQuery,這樣做會更困難,並使用更多的資源。您可以使用:

data: { 
    action: 'register_user', //calls wp_ajax_nopriv_ajaxlogin 
    'username': $('#signupname').val(), 
    'email': $('#signupemail').val(), 
    'password': $('#signuppassword').val(), 
    'security': $('#security').val() 
}, 

如果你確實有相同的id更多的元素,阻止你做什麼,並瞭解了id屬性。

接下來,在成功回調中,您使用值data.loggedin,但您從未在ajax_signup函數上回顯有效的JSON輸出。這可能是爲什麼沒有重定向。

爲什麼數據沒有正確寫入數據庫,請使用var_dump($_POST)並在Developer Tools的網絡選項卡上檢查響應。您可能希望在請求前打開它,以確保它被捕獲。

最後,我可能是錯的,因爲我不使用WordPress的很長一段時間,但因爲你只用wp_insert_user,沒有辦法返回一個用戶登錄,或至少它沒有記載:https://developer.wordpress.org/reference/functions/wp_insert_user/

+0

感謝您的幫助,我編輯了我的'data'部分。我仍然對此有所瞭解,所以我不太清楚如何爲'ajax_signup'添加回顯,或者在var_dump'中代碼的確切位置。您能夠提供幫助嗎? –

+0

''var_dump($ _ POST)'應該添加到'ajax_signup'函數體中。 –

+0

好吧,我把'\t echo「

" . print_r($_POST, true) . "
」;'放到'ajax_signup'中,因爲'var_dump'只是讓我的本地主機進入白屏。我在網絡選項卡上查找的是什麼?我看到admin-ajax php被調用,只要我點擊提交 –