top of page
schooloffiche

How to Mask Field Input Data with CSS for Better User Experience


 

Introduction:

One way to enhance privacy is by using CSS to keep field input data hidden as users complete a form. This technique can be particularly useful for sensitive information, such as passwords or personal details, that you don’t want to be visible on the screen.

By applying specific CSS properties, you can make input fields appear masked, providing a layer of visual security. However, it’s important to note that this method only protects the data from being seen on the form during the input process. It does not encrypt the data or provide true security against more sophisticated threats.


Hide sensitive input data on a form field - Modern Designer


  1. Select CSS in the top right corner.

  2. Copy and paste the CSS code from the Laserfiche Advent Calendar Day 16 into CSS.

  3. Add "masked-text" to the CSS Class for a single line field.

  4. Create a second single line text and use the Advanced Calculation to equal the value of the first single line field the data will be entered in if the value should be viewable in the process. *You can also use field rules to remove the CSS class based on the process step.


    *Add regular expressions or built in input masking to ensure valid data in your masked input field.




Stop by every day for more holiday fun on the Laserfiche Advent Calendar.


0 views
bottom of page