Front end ajax user login session issue


I am having an issue where the ajax login form allows me to login, sort of. If I set the redirect to the homepage after login it sends me to the homepage and gives me the admin bar at the top. However if I try to then go to the admin dashboard it asks me to login again with the normal wordpress login.

How can solve this issue? My codes:

in page-login.php template:

<form id="login" class="ajax-auth" action="login" method="post">
    <p class="status"></p>  
    <?php wp_nonce_field('ajax-login-nonce', 'security'); ?>  
    <div class="form-group">
        <input id="username" placeholder="<?php _e('Username','my-theme'); ?>" type="text" class="required form-control" name="username">
    <div class="form-group">
        <input id="password" placeholder="<?php _e('Password','my-theme'); ?>" type="password" class="required form-control" name="password">
    <input class="btn btn-block btn-md btn-info" type="submit" value="<?php _e('Login','my-theme'); ?>">

in functions.php:

function ajax_auth_init(){  
  global $theme_options;

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

  wp_localize_script( 'ajax-auth-script', 'ajax_auth_object', array( 
    'ajaxurl' => admin_url( 'admin-ajax.php' ),
    'redirecturl' => get_page_link($userProfilePage),
    'loadingmessage' => __('Please wait...','my-theme')

  // Enable the user with no privileges to run ajax_login() in AJAX
  add_action( 'wp_ajax_nopriv_ajaxlogin', 'ajax_login' );
// Execute the action only if the user isn't logged in
if (!is_user_logged_in()) {
    add_action('init', 'ajax_auth_init');
function ajax_login(){

  // 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
    // Call auth_user_login
  auth_user_login($_POST['username'], $_POST['password'], __('Login','my-theme')); 

function auth_user_login($user_login, $password, $login){
  $info = array();
  $info['user_login'] = $user_login;
  $info['user_password'] = $password;
  $info['remember'] = true;

  $user_signon = wp_signon( $info, false );
    if ( is_wp_error($user_signon) ){
    echo json_encode(array('loggedin'=>false, 'message'=>__('Wrong password or username.','my-theme')));
    } else {
        echo json_encode(array('loggedin'=>true, 'message'=> $login.__(' successful, redirecting...','my-theme')));


and ajax-logreg-script.js file:

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

    // Perform AJAX login/register on form submit
    $('form#login, form#register').on('submit', function (e) {
        if (!$(this).valid()) return false;
        $('p.status', this).show().text(ajax_auth_object.loadingmessage);
        action = 'ajaxlogin';
        username =  $('form#login #username').val();
        password = $('form#login #password').val();
        email = '';
        security = $('form#login #security').val(); 
        ctrl = $(this);
            type: 'POST',
            dataType: 'json',
            url: ajax_auth_object.ajaxurl,
            data: {
                'action': action,
                'username': username,
                'password': password,
                'email': email,
                'security': security,
            success: function (data) {
                $('p.status', ctrl).text(data.message);
                if (data.loggedin == true)
                  document.location.href = ajax_auth_object.redirecturl;
                else if (ctrl == 'register')

    $(".logreg-page form#login").validate({
        ignore: ".ignore",
       rules: {
         username: {
            required: true,
          password: {
            required: true,
       messages: {
          username: "Please enter an username.",
          password: "Please enter your password.",
, Faruk 2 years 0 Answers 135 views 0

Leave an answer