Skip to content
Advertisement

Check if email exists in WordPress through Ajax on HTML form submision

In my WordPress v5.8.2, I have localized the ajax_url in the functions.php:

wp_enqueue_script('site_scripts', get_stylesheet_directory_uri() . '/assets/js/site-scripts.js', array('jquery'), null, true);

wp_localize_script('site_scripts', 'site_ajax', array('ajax_url' => admin_url('admin-ajax.php'), 'check_nonce' => wp_create_nonce('site_ajax_nonce')));

With the below jQuery script I am processing the form to check if the email ID from the HTML form is already existed in the WordPress:

   $(document).on("submit", "#form", function(e) {
     e.preventDefault();
     $email = $(this).find('input[name=email]').val(); // email
     //ajax request, check if user exists
     $.ajax({
       type: "GET",
       dataType: 'json',
       url: site_ajax.ajax_url,
       data: {
         email: $email,
         action: 'email_exists_check',
         security: site_ajax.site_ajax_nonce
       },
       success: function(data) {
         if (data.result) {
           alert('Email exists!');
         } else {
           alert('Email does not exists!');
         }
       }
     });
   });

Below the PHP code in separate file to check email:

add_action('wp_ajax_email_exists_check', 'email_exists_check');
add_action('wp_ajax_nopriv_email_exists_check', 'email_exists_check');

function email_exists_check() {

    // Check nonce and email is set by ajax post.
    if (isset($_POST['email']) && wp_verify_nonce('check_nonce', 'security')) {
        // Sanitize your input.
        $email = sanitize_text_field(wp_unslash($_POST['email']));
        // do check.
        if (email_exists($email)) {
            $response = true;
        } else {
            $response = false;
        }
        // send json and exit.
        wp_send_json($response);
    }
}

The above entire code is not able to alert if email exists.

How can I make this code work?

Update #1

As per @Howard E advice, I found the PHP file that contained the email_exists_check() function was not loaded.

Now that the PHP file is loaded, I am not getting the actual email_exists status. For both existed and non-existed email, alert is always Email does not existed (data.result == false).

Seems the email_exists_check function itself is not loading. I checked the log with below code, and the response in either undefined or 0:

 success: function (json) {
     console.log(json);
 }

Advertisement

Answer

It was the wp_verify_nonce causing the issue.

This is how I have modified the code and is working fine in all aspects as expected:

$(document).on("submit", "#form", function(e) {
     e.preventDefault();
     $email = $(this).find('input[name=email]').val(); // email
     //ajax request, check if user exists
     $.ajax({
       type: "GET",
       dataType: 'json',
       url: site_ajax.ajax_url,
       data: {
         email: $email,
         action: 'email_exists_check',
         check_nonce: site_ajax.check_nonce
       },
       success: function(data) {
         if (data.result) {
           alert('Email exists!');
         } else {
           alert('Email does not exists!');
         }
       }
     });
   });

Note the replacement of security with check_nonce in the data:.

Below the PHP code:

add_action('wp_ajax_email_exists_check', 'email_exists_check');
add_action('wp_ajax_nopriv_email_exists_check', 'email_exists_check');

function email_exists_check() {
    // Check nonce and email is set by ajax post.
    if (wp_verify_nonce($_POST['check_nonce'], 'site_ajax_nonce')) {
        // Sanitize your input.
        $email = sanitize_text_field(wp_unslash($_POST['email']));
        // do check.
        if (email_exists($email)) {
            $response = true;
        } else {
            $response = false;
        }
        // send json and exit.
        wp_send_json($response);
    }
}

Note the if (wp_verify_nonce){} statement and the use of nonce.

User contributions licensed under: CC BY-SA
9 People found this is helpful
Advertisement