Masking Input Values

Contact Us or call 1-877-932-8228
Masking Input Values

Masking Input Values

The <cfinput> tag has a mask attribute that controls the format the user enters into a text field. The syntax is as follows:

<cfinput type="text" name="phone" mask="(999) 999-9999">

The table below shows the mask characters for HTML fields:

Text Input Mask Characters
Character Description
A A-Z (case-insensitive)
X A-Z (case-insensitive) or 0-9
9 0-9
? Any character
Other Characters Inserts literal character

The code sample below shows some samples of masking:

Code Sample:

FormValidation/Demos/Masks.cfm
<html>
<head>
  <title>Masks</title>
</head>
<body>

<cfform method="post" action="#CGI.SCRIPT_NAME#" format="html">
	Phone: <cfinput type="text" name="phone" mask="(999) 999-9999"><br/>
	SSN: <cfinput type="text" name="ssn" mask="999-99-9999"><br/>
	Course ID: <cfinput type="text" name="course_id" mask="AAA99X"><br/>
	<cfinput type="submit" name="Submit" value="Submit">
</cfform>

</body>
</html>

Open the page in your browser and enter fields. You will notice that the format of your entry is controlled and that some characters are automatically inserted.

Next