Show/Hide Input Field (Password)
Application Type
Traditional Web

Hi,

I wanted to create an input field which is I will use for the password wherein the user can toggle if he/she wants to hide or show the password.


I tried the Input Password but I don't know how can I make it to show the input value.

Solution

Hello @Ruru 

You can give the 'Toggle Show Password' forge component a try.

There's another forge component that does the same thing - 'Toggle Password'

Regards,

AJ

Thanks Aj, I'll try that one.

am i doing it right?

Hi Ruru,

You can use below java script in to onclick action to toggle between hidden password and text password.

You can refer below solved solutions

https://www.outsystems.com/forums/discussion/46293/toggle-the-2nd-password-field/

https://www.outsystems.com/forums/discussion/36951/toggle-password/

Good luck!!

Thanks, Aadhavan S

Hi Asdhavan, I'm using traditional. I can't seem to find where can I put the js script.

Hi Ruru, 

You can run javascript in traditional web application also if you don't want to integrate with any forge components..

Refer how to run javascript in traditional web application

https://success.outsystems.com/Documentation/11/Extensibility_and_Integration/JavaScript/Extend_Your_Web_Application_Using_JavaScript/Define_and_Run_JavaScript_Code

Thanks, Aadhavan S


Hi Aadhavan this is so helpful!


Thank you very much!

mvp_badge
MVP
Solution

Hi Ruru,

For the mentioned use case, use the TogglePassword server action, defined in the OutSystemsUIWeb module as shown below.

and also set the Password Input type as password


See this sample app Toggle Password

Refer to the attached .oml file


I hope this helps you!


Kind regards,

Benjith Sam

TWALabTogglePassword.oml

Thank you so much Benjith, this is also helpful!

mvp_badge
MVP

You're most welcome, Ruru.

Glad to help you :)


Kind regards,

Benjith Sam

Solution

Hello @Ruru 

You can give the 'Toggle Show Password' forge component a try.

There's another forge component that does the same thing - 'Toggle Password'

Regards,

AJ

Thanks Aj, I'll try that one.

am i doing it right?

Hi Ruru,

You can use below java script in to onclick action to toggle between hidden password and text password.

You can refer below solved solutions

https://www.outsystems.com/forums/discussion/46293/toggle-the-2nd-password-field/

https://www.outsystems.com/forums/discussion/36951/toggle-password/

Good luck!!

Thanks, Aadhavan S

Hi Asdhavan, I'm using traditional. I can't seem to find where can I put the js script.

Hi Ruru, 

You can run javascript in traditional web application also if you don't want to integrate with any forge components..

Refer how to run javascript in traditional web application

https://success.outsystems.com/Documentation/11/Extensibility_and_Integration/JavaScript/Extend_Your_Web_Application_Using_JavaScript/Define_and_Run_JavaScript_Code

Thanks, Aadhavan S


Hi Aadhavan this is so helpful!


Thank you very much!

mvp_badge
MVP
Solution

Hi Ruru,

For the mentioned use case, use the TogglePassword server action, defined in the OutSystemsUIWeb module as shown below.

and also set the Password Input type as password


See this sample app Toggle Password

Refer to the attached .oml file


I hope this helps you!


Kind regards,

Benjith Sam

TWALabTogglePassword.oml

Thank you so much Benjith, this is also helpful!

mvp_badge
MVP

You're most welcome, Ruru.

Glad to help you :)


Kind regards,

Benjith Sam

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.