How to create an error message for a signup form?

Ask the community
, ,
1

If someone is signing up for my website with an email that is already taken, I want an error message that says “Email is already taken” to show up on the light box where my signup form is. I checked off the collapsed option for the text, but I cannot get it to show up when an already taken email is inputted. Here is my code:

import wixData from “wix-data” ;
$w.onReady( function (){
// nothing to do here
});

export function button2_click(event) {
//Add your code for this event here:
$w( ‘#button2’ ).onClick( function (){
let email = $w( ‘#input2’ ).value
return wixData.query( “Members/PrivateMembersData” )
.eq( ‘loginEmail’ , email)
.find()
.then((results)=> {
if (results.items.length > 0 ) {
$w( ‘#text15’ ).expand()
}
});
});
}

Button2 is the submit button and text15 is the error message. Can anybody tell me what I am doing wrong?

2

You are defining an onClick() event handler inside of another onClick() event handler. Your button2_click() function should look something like this:

export function button2_click(event) {
   let email = $w('#input2').value
   return wixData.query("Members/PrivateMembersData")
            .eq('loginEmail', email)
            .find()
            .then((results)=> {
                if(results.items.length > 0) {
                    $w('#text15').expand()
                }
            });
}
3

The message is still not showing up. Could there be a problem in my query? Thank you for the reply.

4

@troybreadbasket Hmm, I just noticed that the return is not needed for the query:

Not this:
return wixData . query ( “Members/PrivateMembersData” )

But this:
wixData . query ( “Members/PrivateMembersData” )

If you’re still having problems, then you should put a console.log(results.items) statement inside of the .then() to see what you’re getting for the query results. That will let you know if your query is working. Like this:

            .then((results)=> {
		console.log(results.items);
                if(results.items.length > 0) {
                    $w('#text15').expand()
                }
            });