Login with link {Name} - {ID}

#location #dynamic #page #login

what i’m trying to do is redirect users to their dynamic site
when they register, it’s okay, I can send them to their dynamic site

but what it does not do is when they use the (login) button after completing the registration does not work for sending to their dynamic page

i need link must be {name}

Sign up Code (Working)


//// Sign up - to dynamic 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 () {

 $w("#registrationButton").onClick((event) => {
  console.log("Button was clicked"); //You can change the text of this line or delete it
  $w('#errorMessage').hide(); //We want to hide all error messages when the person attempts to register again
  $w('#emailExists').hide(); //We want to hide all error messages when the person attempts to register again
 if ($w("#email").valid && $w("#password").valid && $w("#name").valid && $w("#lastName").valid) {
 let email = $w("#email").value;
 let password = $w("#password").value;
 let name = $w("#name").value;
 let last = $w("#lastName").value;

   wixUsers.register(email, password, {
     contactInfo: {
 "firstName": name,
 "lastName": last
     }
    })
    .then((result) => {
     $w("#dataset1").save()
      .then((item) => {
       wixLocation.to(`/member/${name}`);   //URL register
      })
      .catch((err) => {
 let errMsg = err;
      });
    })
    .catch((err) => {
 let errorMsg = err;
     console.log(err);
     $w('#emailExists').show(); //error
    });
   console.log("Trying to register"); //error

Login Code (Not working)

//// Login - to dynamic page///////

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

$w.onReady(function () {
});

export function loginButton_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/${name}`);    //URL login
   } )
    .catch( (err) => {
     console.log(err);
     $w("#errorMessage").show(); ///error
   } ); 
}

You are redirecting with this line of code:

wixLocation.to(`/member/${name}`);//URL login

However, the variable name is not set anywhere in the code.

@qlirim-qh take a look at the code example here: https://www.wix.com/velo/reference/wix-users/currentuser

I think you want user.id for name, right?

@shannon34563 What i’m trying to do is redirect users to their dynamic link site {ID} or {Name} … after pressing (login button)

@yisrael-wix Any help how can make this possible !

///Codes I am trying but to no avail///

let ID = $w("#dataset1").getCurrentItem()._id;

wixLocation.to(`/member/`+ ID); 

///Or///
let ID = $w("#dataset1").getCurrentItem()._id;

wixLocation.to(`/member/{ID})`;  

///

wixLocation.to(`/member/${ID}`);
///Or///
let ID = $w("#dataset1").getCurrentItem()['link-member-all'];

wixLocation.to(ID); 

Like Yisrael already mentioned it in his first answer…


Your code… (modified & optimized)…

//// Login - to dynamic page///////
import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
import wixData from 'wix-data';

$w.onReady(function () {
   $w('#loginButton').onClick(()=>{console.log("click");
      let email = $w("#email").value; console.log("Email: ", email);
      let password = $w("#password").value; console.log("PW: ", password);
      let name = $w("#name").value; console.log("Name: ", name);

      wixUsers.login(email, password,)
      .then(() => {console.log(name + " is now logged in.");
          wixLocation.to(`/member/${name}`); //URL login
       })
       .catch((err) => {console.log(err); $w("#errorMessage").show();}); 
   });
});

do not include …(not defined

let name = $w("#name").value;

These are the 2x important DB-fields…

wixLocation.to(`/member/${name}`); //URL login

Tip: Try to use more the function of —> CONSOLE-Logs!
You know where to find the CONSOLE?

@russian-dima Thank you very much for the answer at last after a long time someone answered me.

I looked at your code but the thing is that I only ask current users for login only ‘email and password’ and your code says this when I write it ("An element with the ID ‘#name’ does not exist on this page. Select another element and view or edit its ID in the Properties & Events panel. ") … if this can be done without this .value in the form of a code.

Console (Yes I know how to find it)

To enable this can be done with the value of the email or adding the name element (but all I need is for the user to be asked for the email and password) and the dynamic link of the page to be / $ {name} or $ { ID}

@qlirim-qh Could you solve it already, or is it still unresolved?

If unresolved —>https://www.wix.com/velo/reference/wix-users-backend/getuser

import wixUsersBackend from 'wix-users-backend';
2
3export function getUser(id) {
4  return wixUsersBackend.getUser(id)
5    .then((user) => {
6      return user;
7    });
8}

@russian-dima unresolved :sweat:
Can you fill in this code that you sent me now with what I already have because I am not very good with coding

@qlirim-qh
You will need first to create a Back-End-JSW-FILE…(where you will insert the BACK-END-CODE )…

//Backend-Code...
import wixUsersBackend from 'wix-users-backend';

export function getMemberDetail(ID) {
   return wixUsersBackend.getUser(ID)
   .then((user) => {
       return user;
   });
}

This will be your FRONT-END-CODE…

//Front-End-Code...
import wixData from 'wix-data';
import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import {getMemberDetail} from 'getMember.jsw';
import wixWindow from 'wix-window';


$w.onReady(function() {
   $w('#loginButton').onClick(()=>{console.log("click");
      let email = $w("#email").value; console.log("Email: ", email);
      let password = $w("#password").value; console.log("PW: ", password);
 
     wixUsers.login(email, password,)
     .then(async() => {console.log(email + " is now logged in.");
        let user = wixUsers.currentUser;
        let userID = user.id; console.log("User-ID: ", userID)
        let isLoggedIn = user.loggedIn; console.log("User-Logged-In = ", isLoggedIn)

        let userData = await getMemberDetail(userID); console.log(userData)
 
 /*
            You will get in the console something like this....
                {
            *   "id": "dn8sf9c2-4e9f-a02d-a58d-f244d999729a",
            *   "memberName": "John Doe",
            *   "firstName": "John",
            *   "lastName": "Doe",
            *   "nickname": "johnd",
            *   "slug": "johnd123",
            *   "language": "en",
            *   "status": "ACTIVE",
            *   "loginEmail": "john.doe@somedomain.com",
            *   "creationDate": "2019-08-05T11:29:39Z",
            *   "lastUpdateDate": "2019-08-12T12:29:43.810Z",
            *   "lastLoginDate": "2019-08-12T13:42:30Z",
            *   "emails": [
            *     "john.doe@somedomain.com",
            *     "doughyjohn@anotherdomain.com"
            *   ],
            *   "phones": [
            *     "5555555555",
            *     "5555555556"
            *   ],
            *   "labels": [
            *     "contacts-new",
            *     "contacts-site_members_approved"
            *   ],
            *   "picture": {
            *     "url": "https://.../photo.jpg"
            *   }
            *   "customText": "Custom Text",
            *   "customNumber": 12345
            * }
        */
            console.log("First-Name: ", userData.firstName);
            console.log("First-Name: ", userData.firstName);
            console.log("Last-Name: ", userData.lastName);
            console.log("Nick-Name: ", userData.nickname);
            console.log("Slug: ", userData.slug);
         //  .....and so on......


         //  let name = FIGURE OUT HERE HOW TO SETUP THE NEEDED VALUE FOR THIS
         //  let name = slug ???
         //  let name = firstName ???
         //  let name = lastName ???
         //  ...and so on ...

            wixLocation.to(`/member/${name}`); //URL login
         })
         .catch((err) => {console.log(err); $w("#errorMessage").show();}); 
     }); 
});

Something in this direction :wink:

And please never show code as —> pic (it is useless) .
Show always CODE in —> CODE-BLOCKS.

Some similar system, you will find working here…
https://www.media-junkie.com/custom-registration

Read the related post.

@russian-dima Thank you very much.

(Cannot find module ‘getMember.jsw’ or its corresponding type declarations.)

I added backend/ getMember.jsw ’

Man thank you very much you finally chose me this I was trying to solve for a long time Thank You very Muchhh.

You are wonderful :100:

@qlirim-qh Issue resolved or still in trouble?
Sorry for the little mistake here…

import{getMemberDetail} from 'getMember.jsw';

But as i can see you have managed it by your own at the end…

import{getMemberDetail} from 'backend/getMember.jsw';

@russian-dima Your code worked very well thank you so much.