← All Scripts

#46 - Confirm Password v0.1

Add a confirm password input to your signup & password reset forms.

Need help with this MemberScript?

All Memberstack customers can ask for assistance in the 2.0 Slack. Please note that these are not official features and support cannot be guaranteed.

View demo


var password = document.querySelector('[data-ms-member=password]')
  , confirm_password = document.querySelector('[ms-code-password=confirm]')

function validatePassword(){
  if(password.value != confirm_password.value) {
 		confirm_password.setCustomValidity("Passwords Don't Match");
  } else {

password.onchange = validatePassword;
confirm_password.onkeyup = validatePassword;
Confirm Password
Add a password confirmation field to your password reset forms.
repeat password,

Creating the Make.com Scenario

1. Download the JSON blueprint below to get stated.

2. Navigate to Make.com and Create a New Scenario...

3. Click the small box with 3 dots and then Import Blueprint...

4. Upload your file and voila! You're ready to link your own accounts.

How to Make Members Confirm their Password on your Webflow Site

Memberscripts needed:

  1. https://www.memberstack.com/scripts/46-confirm-password




Why/When would need to Make Members Confirm their Password?

  1. Ensure users don’t have typos in their passwords when creating an account.

No one wants to create a new account and later have to reset their password because they accidentally mistyped it when signing up.

To avoid this, you can simply add an additional password confirmation field to your sign-up form, forcing users to type their passwords twice. This will ensure that they get their passwords right and avoid any unpleasantness.

Unless, of course, they mistype them the exact same way twice, in which case… that’s just on them.

Making website members confirm their password on Webflow sites

To add a password confirmation field to a Webflow form, we’re going to use MemberScript #46 – Confirm Password. Follow the link to get the code you’ll need to add to your page and watch a video tutorial on how to set everything up.

Setting up the form

The first thing you’ll need to do is build out the form itself and style it however you want.

Once you’ve created the form and you’ve added a password confirmation field, select the field and add the following attribute to it:

  • ms-code-password=”confirm”

As far as setting up the field, that’s all there is to it.

If you want to go the extra mile, you can add some additional styling to the password confirmation field based on whether the passwords match or not.

For example, once users start typing the password in the confirmation field, its background can be red, and once the passwords match, the background can turn green.

To do this, simply add a div block inside the same wrapper as the confirmation field itself and under this div block another two empty div blocks. Next, add combo classes to each empty div block, each with the same class as the form field itself and an additional “valid” or “invalid” class.

After you’ve styled the two empty div blocks, go ahead and select the parent div block and set its visibility to hidden.

Making it work

Now that you’ve got the form set up and you’ve created the show/hide buttons, all you need to do is add the MemberScript #46 custom code to your page, before the closing body tag.


That’s everything, you can now go ahead and test your form’s show/hide password feature.

If you want to use our demo project to get you started, just click the button below to add it to your Webflow site.

Our demo can help you add a password confirmation field to your form and block submissions unless the two passwords match.

Take me to the Scripts