Agree with J.D. about you needing to have turned on the onClick event in the properties panel for both the ‘login’ and the ‘profileButton’.
Which it does say in the code to do as well.
We add an event handler by selecting the login button and we use the Properties panel to add a handler for the onClick event.
As for the second part, are you trying to create your own custom signup lightbox as you can just do something like this.
import wixUsers from 'wix-users';
import wixWindow from 'wix-window';
import wixLocation from 'wix-location';
$w.onReady(function () {
$w("#registerButton").onClick( (event) => {
let email = $w("#email").value;
let password = $w("#password").value;
let first = $w("#firstName").value;
let last = $w("#lastName").value;
wixUsers.register(email, password, {
contactInfo: {
"firstName": $w('#firstName').value,
"lastName": $w('#lastName').value,
}
} )
.then( (result) => {
let resultStatus = result.status;
wixWindow.lightbox.close();
wixLocation.to("/sign-in-status"); //Change the URL ending to whatever page you want to send the user to after they log in.
} );
} );
});
This works perfectly and closes after registering details before moving users to signup status page, then both names will be saved in Contacts and once site member is manually approved the member details will be added to ‘members’ database.
Plus, like J.D. has said, change your ID to whatever it should be, see here for system field names and keys that should be used.
CMS (Formerly Content Manager): About Your Collection Fields | Help Center | Wix.com
Finally, as for the login part of your code, which in theory should have been the second part of your code however you adjusted it for register for some reason, should be like this.
import wixUsers from 'wix-users';
import wixData from 'wix-data';
import wixLocation from 'wix-location';
$w.onReady( () => {
if(wixUsers.currentUser.loggedIn) {
$w("#login").label = "Logout";
$w("#profileButton").show();
}
else {
$w("#login").label = "Login";
$w("#profileButton").hide();
}
} );
Whereas I use this on my lightbox.
import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
import wixWindow from 'wix-window';
$w.onReady(function () {
$w("#forgotPassword").onClick( (event) => {
//wixWindow.lightbox.close()
wixUsers.promptForgotPassword()
.then( ( ) => {
//
} )
.catch( (err) => {
let errorMsg = err; //"The user closed the forgot password dialog"
});
});
});
export function loginButton_onclick(event) {
let email = $w("#email").value;
let password = $w("#password").value;
wixUsers.login(email, password)
.then( () => {
console.log("User is logged in");
wixWindow.lightbox.close();
wixLocation.to(wixLocation.url); //This reloads the same page and allows code to show hidden member parts.
} )
.catch( (err) => {
console.log(err);
$w("#errorMessage").expand(); // You can delete this line if you are not going to add an error message. Use a regular text element set to 'collapse on load' from the Properties Panel.
} );
}
Again, simply change the url in wixLocation.to to whatever you want yours to be.