Cacher is the code snippet organizer for pro developers

<?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 );
?>

<?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' );
?>

<?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; ?>

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
        }
      }
    });
    
  });
});