Members Profile

Hello,Someone that has some experience in WixCode!!i’m trying to create a User Interface , but i have a problem finishing it up.
So, the concept is having the info being fetched by the database.This is already done and working perfectly.Each User has a example.com/clients-list/USEREMAIL , and according to the user email the data is being fetched from the database.
Second Step was to create an admin area, that will be able, again with a UI, to change the client’s info, without needing to do it from within the database editor.This is aswell done and works great.

Now the last step , that i cant find a way to do it for the last couple of days…is the login.The login calls the wix-users API to prompt the user to Login.then it redirects them using the wixLocation API and redirects them to example.com/clients-list/$USEREMAIL

CustomLoginButton Code

import wixUsers from 'wix-users'; 
import wixLocation from 'wix-location'; 
     export function customLoginButton_onClick()        
     { wixUsers.promptLogin()          .
     then( (user) =>           
          { let userEmail = wixUsers.currentUser.getEmail();               
          wixLocation.to(`/client-data/${userEmail}`);           
          }  );        
      }

It seems fine to me…i dont know what is wrong but it just wont work.The login button should go like this:

  1. User Login opens

  2. User Logins

  3. User is redirected to example.com/clients-data/$userEmail

to debug this,
try to replace your wixLocation.to() call with this:

wixLocation.to('/');

this should route you to the home page of the site.
if this works then it means you’re passing in the wrong URL.

p.s.
in your post you mixed “clients-data” and “clients-list”.
could this be the problem?

Hello, Ziv and thank you for your answer.
Client-List is the correct one, i changed it in the code - the problem is though, that it doesnt even prompt the user to login.
You click the button and nothing happens.
Login Page doesn’t show for the user to login…

so it seems this code never gets called.
are you sure your customLoginButton has an event handler for the ‘click’ event?
you can check this in the properties panel for the button.
if the event handler is set, the onClick event should look like this:
onClick: customLoginButton_onClick

Aw yeah that was my bad!I had it on MousIN
Changed it now, and it prompts the user Login perfectly
Almost perfectly actually…
Something weird is happening, When you are at home page and you click on the button it prompts the login, but when you are on a different page, it does not…The button is in the Header, and it is shown on all pages.
www.futurevisionweb.com
From the Home Page that the login prompt works, if you login, it still does not redirect you in the link.

the event handlers for a component that is shown on all pages has to go into the site code panel, not the page code panel.
read about this here:

once the event handler is in the site panel, it should get called from whichever page the user was in when the button was clicked.

Yeah, it is on the “Site Code” , not on the Page…

the “.then” part has to follow the promptLogin() call.
you want the code in the “then” part to run after the login is done, so the “.then” has to be applied to the promptLogin() call, not the console.log() call…

try it out.

Still not work :frowning:
I had it like this also before.I added the console logs to see where the goes reaches in debugging, but i can’t review the login proccess in the editor so it serves no purpose…

export function customLoginButton_onClick() {
     wixUsers.promptLogin()      
     .then( (user) =>  
          {
          let userEmail = wixUsers.currentUser.getEmail();
          wixLocation.to(`/client-data/${userEmail}`)   ; 
          }  );        
      }

shame.
we’ll have to do an online session to get to the bottom of this.
we will contact you directly to set a timeslot… probably monday morning.

thanks.

Thank you so much!
mariafikata@gmail.com

Hi Maria,
Would you be so kind and let us know if you found the problem?
Did ZIV fix it? If so, how?

Thank you

Hi Luigino,

The core of the issue had two onClick methods for the login button. When you move a button from the inner page to the header, you need to move the onClick method as well to the site code tab. If you have it in both, the one in a page will run, and it will run only on that particular page.

Also, when navigating to a dynamic page you need to append the last part of the URL the following way. Take the email for the logged in user and append it to the end of the dynamic page base URL. It assumes the dynamic page present data coming from a collection that holds these emails.

export function customLoginButton_onClick() {
     wixUsers.promptLogin()      
     .then( (user) =>  
          {
          let userEmail = wixUsers.currentUser.getEmail();
          wixLocation.to('/client-data/' + userEmail)   ; 
          }  );        
      }

Shay

1 Like

Thank you for the feedback Shay.
Very helpful

WOOOH! I figured it out. The above code didn’t work exactly for me and I have zero coding experience. For all of you coders this is meaningless. Feeling accomplished here. I had to modify the code the following way to get the results.

import wixUsers from ‘wix-users’;
import wixLocation from ‘wix-location’;

export function customLoginButton_onClick() {
wixUsers.promptLogin()
.then( (user) => {
let userId = user.id;
let isLoggedIn = user.loggedIn;
let userRole = user.role;
return user.getEmail();
} )
.then( (email) => {
let userEmail = email;
wixLocation.to(‘/Members/’ + userEmail);
});
}