Last active
September 17, 2020 21:11
-
-
Save Aziz-Rahman/75c412f82a489cad03a3 to your computer and use it in GitHub Desktop.
Register user with ajax (WP)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
jQuery(document).ready(function($) { | |
/** | |
* When user clicks on button... | |
* | |
*/ | |
$('#btn-new-user').on("click",function() { | |
/** | |
* Prevent default action, so when user clicks button he doesn't navigate away from page | |
* | |
*/ | |
if (event.preventDefault) { | |
event.preventDefault(); | |
} else { | |
event.returnValue = false; | |
} | |
// If for some reason result field is visible hide it | |
$('.result-message').hide(); | |
// Collect data from inputs | |
var reg_nonce = $('#new_user_registration').val(); | |
var reg_user = $('#reg_username').val(); | |
var reg_pass = $('#reg_password').val(); | |
var reg_mail = $('#email_optional').val(); | |
var reg_name = $('#full_name').val(); | |
var reg_nick = $('#nick_name').val(); | |
/** | |
* AJAX URL where to send data | |
* (from localize_script) | |
*/ | |
var ajax_url = my_reg_vars.reg_ajax_url; | |
// Data to send | |
data = { | |
action: 'register_user', | |
nonce: reg_nonce, | |
user: reg_user, | |
pass: reg_pass, | |
mail: reg_mail, | |
name: reg_name, | |
nick: reg_nick, | |
}; | |
// Do AJAX request | |
$.post(ajax_url, data, function(response){ | |
// If we have response | |
if ( response ) { | |
if ( response === '1' ) { | |
// If user is created | |
$('.result-message').html('Your registration is complete.'); // Add success message to results div | |
$('.result-message').addClass('alert-success'); // Add class success to results div | |
$('.result-message').show(); // Show results div | |
} else { | |
$('.result-message').html(response); // If there was an error, display it in results div | |
$('.result-message').addClass('alert-danger'); // Add class failed to results div | |
$('.result-message').show(); // Show results div | |
} | |
} | |
}); | |
}); | |
}); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php if ( get_option( 'users_can_register' ) ) : // check if user can register on this site ?> | |
<form name="my_registration" class="form-horizontal registraion-form" role="form"> | |
<div class="input-wrapper"> | |
<input type="text" name="full-name" id="full_name" value="" placeholder="Your Name" class="form-control" /> | |
</div> | |
<div class="input-wrapper"> | |
<input type="text" name="nick-name" id="nick_name" value="" placeholder="Your Nickname" class="form-control" /> | |
</div> | |
<div class="input-wrapper"> | |
<input type="email" name="email" id="email_optional" value="" placeholder="Email (Optional)" class="form-control" /> | |
</div> | |
<div class="input-wrapper"> | |
<input type="text" name="username" id="reg_username" value="" placeholder="Choose Username" class="form-control" /> | |
</div> | |
<div class="input-wrapper"> | |
<input type="password" name="password" id="reg_password" value="" placeholder="Choose Password" class="form-control" /> | |
</div> | |
<?php wp_nonce_field( 'reg_new_user','new_user_registration', true, true ); ?> | |
<div class="input-wrapper"> | |
<?php do_action('register_form'); ?> | |
<input type="submit" class="btn btn-primary" id="btn-new-user" value="Register" /> | |
</div> | |
</form> | |
<!-- Alert --> | |
<div class="alert result-message"></div> | |
<?php endif; ?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* Function insert register and validation with ajax | |
* | |
* @package WordPress | |
* @subpackage MyTheme | |
* @since MyTheme 1.0.0 | |
*/ | |
function registration_user() { | |
// Verify nonce | |
if ( !isset( $_POST['nonce'] ) || !wp_verify_nonce( $_POST['nonce'], 'reg_new_user' ) ) { | |
die ( 'Ooops, something went wrong, please try again later.' ); | |
} | |
// Post values | |
$name = esc_sql( $_POST['name'] ); | |
$nick = esc_sql( $_POST['nick'] ); | |
$email = sanitize_email( $_POST['mail'] ); | |
$username = esc_sql( $_POST['user'] ); | |
$password = esc_sql( $_POST['pass'] ); | |
/** | |
* IMPORTANT: You should make server side validation here! | |
*/ | |
$userdata = array( | |
'first_name' => $name, | |
'nickname' => $nick, | |
'user_email' => $email, | |
'user_login' => $username, | |
'user_pass' => $password, | |
); | |
if ( empty( $name ) AND empty( $nick ) AND empty( $email ) AND empty( $username ) AND empty( $password ) ) { | |
echo 'Data can not be empty !'; | |
} | |
elseif ( empty( $name ) ) { | |
echo 'Please fill in your full name !'; | |
} | |
elseif ( empty( $nick ) ) { | |
echo 'Please fill in your nick name !'; | |
} | |
elseif ( empty( $email ) ) { | |
echo 'Email can not be empty !'; | |
} | |
elseif ( !is_email( $email ) ) { | |
echo 'Email address is not valid !'; | |
} | |
elseif ( email_exists( $email ) ) { | |
echo 'Sorry, that email address is already used!'; | |
} | |
elseif ( empty( $username ) ) { | |
echo 'Username can not be empty !'; | |
} | |
elseif ( username_exists( $username ) ) { | |
echo 'Sorry, that username is already used!'; | |
} | |
elseif ( empty( $password ) ) { | |
echo 'Password can not be empty !'; | |
} | |
elseif ( strlen( $password ) < 8 ) { | |
echo 'Password must be at least 8 characters !'; | |
} | |
else { | |
$user_id = wp_insert_user( $userdata ) ; | |
// Return | |
if ( !is_wp_error( $user_id ) ) : | |
echo '1'; // Success registration | |
// Sent email registration automatic | |
$to = $email; | |
$subject = wp_specialchars_decode( get_option('blogname'), ENT_QUOTES ) . ' - Thanks for joining us !'; | |
$body = 'Bla Bla Bla ...'; | |
$headers = array('Content-Type: text/html; charset=UTF-8'); | |
wp_mail( $to, $subject, $body, $headers ); | |
else : | |
echo $user_id->get_error_message(); | |
endif; | |
} | |
die(); | |
} | |
add_action( 'wp_ajax_register_user', 'registration_user' ); | |
add_action( 'wp_ajax_nopriv_register_user', 'registration_user' ); | |
?> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* Enqueue and localize js | |
* | |
*/ | |
function register_user_scripts() { | |
// Enqueue script | |
wp_register_script( 'vb_reg_script', get_template_directory_uri() . '/js/ajax-registration.js', array('jquery'), null, false ); | |
wp_enqueue_script( 'vb_reg_script'); | |
wp_localize_script( 'vb_reg_script', 'my_reg_vars', array( | |
'reg_ajax_url' => admin_url( 'admin-ajax.php' ), | |
) | |
); | |
} | |
add_action( 'wp_enqueue_scripts', 'register_user_scripts', 100 ); | |
?> |
Good job! Thank you!
But you can add "if registration complete" - "Del form"
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Not Working :(