Press enter key to submit login

Ask the community
,
1

This is the code on my login lightbox but I want to be able to press enter to submit, I have a piece of the code for it at the bottom but I wasn’t sure where to put it or what action to put after it (sorry really new to coding)

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_click(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(“/account/my-account”); //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.
} );
}

////////////////////////////////////

$w(“#password”).onKeyPress( (event) => {
if (event.key === “Enter”){

///Put here the code for action you want to execute

}
})

1 Like
2

you would need a key press event for the password and or email user input

see below

import wixUsers from ‘wix-users’;
import wixWindow from ‘wix-window’;

function tryLogin(){
let email = $w(“#email”).value
let password = $w(“#password”).value

wixUsers.login(email, password) 
.then(() => {

//user logged in
wixWindow.lightbox.close()
}). catch ((err) => {
console.log(err)
//user failed to login
})
}

$w.onReady( function () {

$w("#email").keyPress((event) => {

if (event.key === “Enter”){
tryLogin()
}
})

$w("#password").keyPress((event) => {

if (event.key === “Enter”){
tryLogin()
}
})

$w("#forgotPassword").onClick( (event) => { 
    wixUsers.promptForgotPassword() 
}) 

$w("#loginButton").onClick((event) => { 
    tryLogin() 
})

})

3

I get an error saying ‘keyPress’ does not exist on ‘#email’ and I get the same for password as well

4

Try this

$w.onReady(function () {
    $w("#email").onKeyPress( (event) => {
        if(event.key === 'Enter') {
            console.log('Sucess'); //call your login function here
        }
         
    $w("#password").onKeyPress( (event) => {
        if(event.key === 'Enter') {
            console.log('Sucess'); //call your login function here
        }
});
5

@megansauer my bad.

Its onKeyPress
not keyPress

6

@purslowewebdesign THanks a ton: ) It worked for me in 2021. Lots of love.

7

Thanks for posting this.