Creating Custom Registration and Login

Ask the community
, ,
1

Hi everyone, my first post and I’m hoping someone can help because I’m really up against it for time. I’ve been creating a website for a charity event and need to have users be able to create accounts and log in. I’ve followed some online tutorials to try and make it work and I think it’s not far off but I can’t get it to work properly.

This is the code for the user registration page:

import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
import wixData from 'wix-data';
let registration;

$w.onReady(function () {

 if (wixUsers.currentUser.loggedIn) {
  wixLocation.to("/members/profile"); //Change the URL ending to the page you want to redirect the user if they are already logged in
 }

 $w("#registrationButton").onClick(() => {
  console.log("Button was clicked"); 
  $w('#errorMessage').hide(); 
  $w('#emailExists').hide(); 
  if ($w("#email").valid && $w("#password").valid && $w("#name").valid ){
   let email = $w("#email").value;
   let password = $w("#password").value;
   let name = $w("#name").value;
  

   wixUsers.register(email, password)
    
    .then((result) => {
     $w("#dataset1").save()
      .then((item) => {
       wixLocation.to("/members/profile"); 
      })
      .catch((err) => {
       let errMsg = err;
      });
    })
    .catch((err) => {
     let errorMsg = err;
     console.log(err);
     $w('#emailExists').show(); 
    });
   console.log("Trying to register"); 
  }

 });

});

I think this code might be working as when I try and register a second time it now comes up saying the email is already in use.

The code for the log in page is below:

import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
import wixData from 'wix-data';

export function loginNow_click(event) {

 let email = $w("#email").value;
 let password = $w("#password").value;

 wixUsers.login(email, password)
   .then( () => {
     console.log("User is logged in");
     wixLocation.to("/member/profile");  
   } )
    .catch( (err) => {
     console.log(err);
     $w("#text27").expand();  
   } ); 
}

When I click the log in button nothing happens so I know there is an issue with this.

I’m a complete novice so any help would be fantastic!

2

Your first part of the code could be simplified to this:

import wixUsers from "wix-users"
import wixLocation from "wix-location"

$w.onReady(() => {
    wixUsers.currentUser.loggedIn && wixLocation.to("/members/profile")
    //Change the URL ending to the page you want to redirect the user if they are already logged in

    $w("#registrationButton").onClick(async () => {
        console.log("Button was clicked")

        $w("#errorMessage").hide()
        $w("#emailExists").hide()

        if ($w("#email").valid && $w("#password").valid) {
            let email = $w("#email").value
            let password = $w("#password").value

            let registration = await wixUsers.register(email, password)
            registration.status === "Active"
                ? wixLocation.to("/members/profile")
                : console.log(registration)
        }
    })
})

The second part, that is the login page, seems ok.

What you have to check is if the user is Pending or Active, if it is Pending (awaiting for admin authorization), it will not log in.