Forum Documentation Showcase Pricing Learn more

Password field Show/Hide


#1

Based on this:

http://uxmovement.com/forms/why-the-confirm-password-field-must-die/

It’s either you like it or don’t like it movement so I’m hoping it doesn’t start a discussion here :slight_smile:


#2

I’m confused about the post. Are you making this a feature request? Are you sharing something you built? It’s definitely a fine bit of functionality, I’m just not sure what your intention is. Sorry!


#3

Yuo. Feature request :slight_smile: It’s in the “idea” category :slight_smile:


#4

I ended up building it.

It was quite easy.

You just need a Text field with the value of the password input, 2 icons, 1 state and 1 workflow to show/hide elements based on the state.

Make sure that the Text field mimics the style of the input so the transition is seen as transparent.


#5

can you share demo please


#6

@romanmg created a video showing how this can be done


#7

thanks


#8

hey again sorry maybe bothering you but how do i layer it over and still make it editable? so can type and show at the same time, if that makes any sense? https://storywall.bubbleapps.io/version-test/sign-up?debug_mode=true , also how to make demos?


#10
Summary

This text will be hidden

oh demo is easy i guess, nice got editor badge or whatev


#11

but you cant type and show at same time right.


#12

Hi - I think this may be about as good as you can get it. If you have two inputs, ie one setup as “Content format” Password and overlay a second input with “Content format” Text (using a toggle icon to switch between the two), you’ll get into a circular state which will give you run-time errors.


#14

Hey Thanks, yeah i dont think its a good idea to do that then, sign up needs to be as fluid and fast as possible. Hopefully they will implement something soon.

Do you know how to limit emojis in username & how to make usernames not end in “.” or “_” ?


#15

So, I’m mobile right now, but, if you look at the sample (wizard-produced) app, the pw fields have obfuscate functionality. I’m petty sure this is just built in. (Checkbox on text inputs perhaps? Haven’t looked at that in a while, but it can’t be hard to find.)


#16

My solution uses the input for the obfuscated password and a text type to show the password. It wasn’t ideal at the time(december 2016) but it was the only way.

@taiomori Now that you can create plugins I would go that route and create a plugin for this.

This is just one out of dozens of jquery/js plugins:

https://cloudfour.github.io/hideShowPassword/


#17

ok thanks might revisit that later, I dont know how to create plugins yet


#18

thanks


#19

Good timing, this might be useful:


#20

@luke2 @GregoryKing @keith @NigelG

Thank you, can you help me understand some ui stuff now, im going crazy over what seems to be simple logic.

I want text ‘choose username’ to go red when:

  • special character is entered (*)
    -text is under 3 characters
    -existing username

i want text ‘choose username’ to go blue when:
-hovered,
-focused
-valid or complete. (*)

i turn one switch on and it messes up the others!!!
at the moment the (*) are not working how i like,


#21

Here’s the obfuscate (“password”) option:


#22

thank you