How do I make sure that my 'Password' and 'Confirm Password' text fields match? I don't see a library script to validate passwords.
You can create a new library script to handle this type of validation. Here's how:
- Go to Components > BreezingForms > Manage Scripts.
- Click on the NEW icon in the upper right-hand corner of the screen to create a new script.
- On the screen that opens, enter the following variables:
Title: Validate password repeat
Published: YES
Package: FF
Name: ff_password_repeat
Type: Element Validation
Description: Validates that two password fields match. Note: The second password field must be named"FIELDNAME_pwrepeat" (where FIELDNAME is the name that you assigned to the first password field).
- In the codebox text area, enter the following code:
Code:
function ff_password_repeat(element, message) { try{ var repeat = element.name.split("ff_nm_")[1].split("[]")[0]; if(!ff_getElementByName(repeat + '_pwrepeat')){ if (message=='') message = repeat+" has no repeat password field.\n"; ff_validationFocus(element.name); return message; } else { if(ff_getElementByName(repeat + '_pwrepeat').value != element.value){ if (message=='') message = element.name+" and " + repeat + "_pwrepeat do not match.\n"; ff_validationFocus(repeat + '_pwrepeat'); return message; } } }catch(e){ return e.description; } return ''; }
- Click on the SAVE icon at the bottom of the screen to add the script to your library list.
- Now go to your form and create a new element for the user to enter their password into.
The element should have the following settings:
Type: Textfield
Label: Enter Password
Name: password
Value, Size, and Max. length fields can be left blank. If you want to add a hint, you can do so in
the 'Hint'
box.
In the VALIDATION section, enter the following settings:
Required: Checked (if you want an asterisk * to appear beside the form element)
Validation Type: Library
Error Message: Please enter a password.
Script: FF::ff_password_repeat
Then click on SAVE PROPERTIES to save the changes you made to the element.
- Create a new element for the user to re-enter their password. The element should have the following settings:
Type: Textfield
Label: Repeat Password
Name: password_pwrepeat
Value, Size, and Max. length fields can be left blank. If you want to add a hint, you can do so in the 'Hint' box.
In the VALIDATION section, enter the following settings:
Required: Unchecked
Validation Type: None
(There is no need to add a validation rule or type to this field because it will be connected automatically to the rule in the previous password field.)
Then click on SAVE PROPERTIES to save the changes you made to the element.
IMPORTANT: If you change the name of the first textfield from "password" to something else (let's say, "YourPassword" for example), then in the second textfield, you will need to change the name field to YourPassword_repeat. The word in front of "_pwrepeat" MUST match the name given to the first field.
- Once the two elements have been added and their properties saved, you now need to save the form itself. To do so, click on the SAVE icon in the upper right-hand corner of the screen.Then preview your form and test it out!
Or just download this validation script from here and install it using the package installer of Breezingforms: