Terms and Conditions checkbox

Hi
I have a custom registration and I want to add a T&C’s checkbox. Anyone that wants to resister must check the T&C’s before being registered and if not ticked, they must see an error telling them to tick the checkbox before they can register… Can someone please help to update the code below to achieve this please?

import wixUsers from ‘wix-users’;
import wixLocation from ‘wix-location’;
// …
$w.onReady( function (){

$w('#registerButton').onClick( **function**  (){ 

let email = $w(‘#email’).value;
let password = $w(‘#password’).value;
wixUsers.register(email, password,
)
.then(()=>{

        wixLocation.to('/my-page');  

} )
})
})

export function registerButton_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(“/my-page”); //Change the URL ending to whatever page you want to send the user to after they log in.
} )
. catch ( (err) => {
console.log(err);
$w(“#errorMessage”).expand();
} );
}

What you can do is

  • disable the register button on load (uncheck enabled by default button) :

Add on change event (properties panel ) and then when the T&C box is checked enable the register button:

export function checkbox1_change(event) {
 //Add your code for this event here: 
 if($w('#checkbox1').checked){
        $w('#button1').enable();
    }else{
        $w('#button1').disable();
    }
}

Best
Massa

Awesome!! much appreciated

Hi Massa
I tried what you recommended but cant get it to work. PSB. I’m not sure where I am going wrong.


The code used

import wixUsers from ‘wix-users’;
import wixLocation from ‘wix-location’;
// …
$w.onReady( function (){

$w('#registerButton1').onClick( **function**  (){ 

let email = $w(‘#email’).value;
let password = $w(‘#password’).value;

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

        wixLocation.to('/my-page');  

} )
})
})

export function registerButton1_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(“/my-page”); //Change the URL ending to whatever page you want to send the user to after they log in.
} )
. 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.
} );
}

export function agree_change(event) {
if ($w(‘#agree’).checked){
$w(‘#agree’).enable();
} else {
$w(‘#agree’).disable();
}
}

@paven6996 would you please provide your editor’s URL so I can track it easier

@massasalah18

https://paven6996.wixsite.com/website-1

1 Like

Hey
So the problem in disabling and enabling. you are applying that to the agree while you should apply it to the register button.
here how the code should look like:

import wixUsers from 'wix-users';
import wixLocation from 'wix-location';
// ...
$w.onReady(function () {

})

export function registerButton1_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("/my-page"); //Change the URL ending to whatever page you want to send the user to after they log in.
        })
        .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.
        });
}

export function agree_change(event) {
 if ($w('#agree').checked) {
        $w('#registerButton1').enable();
    } else {
        $w('#registerButton1').disable();
    }
}

Good Luck
Massa

Do I feel like a fool…
Its works now. Thank you!

1 Like