UPDATE 7/4/17 – Since version 3.0.31, password fields have been available again in Ninja Forms. When adding fields, type in password in the search/filter bar on the top right to find the fields and add them to the form. If you are using an up-to-date version of Ninja Forms, you should use the built-in password field and not use my solution below.
Ninja Forms 3 doesn’t come built in with a password field, which makes things like user registration with Ninja Forms, a bit less user-friendly.
Luckily with the help of some JavaScript, you can recreate the password field functionality quite easily:
Make sure to change the ID in the Javascript file, which is 3 by default, to match the field ID of your password field. Then make sure to add the custom class ninja-forms-password to that field in your Ninja Forms creator.
Save the JS gist above in a child theme in the following directory:
yourtheme/js/ninja-forms-password-fix.js
Then add the PHP script to your theme’s functions.php file (without the starting PHP tag in the file of course!)
That should convert your plain text password from Ninja Forms into a password field on the front-end, and it should work across browsers too. You can see how it might appear in the JSFiddle here.
Hi Steve,
Thanks for the solution. I’ve placed the files and changed the id but it’s not working. Why is the custom class needed? I don’t see it in the files?
Cheers,
Jaap
Hi Jaap,
I’ve updated some of the code now but you’re right, it’s not quite working with Ninja Forms the way it should. Give me some time and I’ll look into it.
I’ll also have a look into the WooCommerce field issues too!
Cheers,
Steven
Looks like Ninja Forms 3 handles password fields : simply enter “pass” in the search field above the field types, it makes the password field type appear…
It’s just been added in a recent plugin update I see, I’ll update the post just now!