Click here to Skip to main content
13,550,330 members
Click here to Skip to main content
Add your own
alternative version


19 bookmarked
Posted 20 Sep 2007
Licenced CPOL

MaskingText for ASP.NET

, 20 Sep 2007
Rate this:
Please Sign up or sign in to vote.
TextBox Control for ASP.NET with masking facility
Screenshot - Mask1.jpg



As we all knows, there is a MaskedTextBox control for Windows Application, where as in web, there is no masking for TextBox is available, this is the solution of the maskof the text box.

It will allow user to insert the text in predefined mask only.


Some companies like telerik are providing this control for $299 or above, eventhough we are having knowledge, why should I pay? This was the question which inspired me to create this control.

Using the code

A brief description of how to use the article or code. The class names, the methods and properties, any tricks or tips.

Blocks of code should be set as style "Formatted" like this:

<%@ Register Assembly="MaskingText" Namespace="MaskingText" TagPrefix="cc1" %>
<cc1:MaskedText ID="MaskedText1" runat="server" DefaultMask="Phone" Mask="(###) ###-####">(___) ___-____</cc1:MaskedText>

Below is the code syntax for web control library:

Imports System

Imports System.Collections.Generic

Imports System.ComponentModel

Imports System.Text

Imports System.Web

Imports System.Web.UI

Imports System.Web.UI.WebControls


<DefaultProperty("Text"), ToolboxData("<{0}:MaskedText runat="server"></{0}:MaskedText>")> _

Public Class MaskedText

Inherits System.Web.UI.WebControls.TextBox

'# - Numeric

'@ - Alphas

'? - Any Character

Private MaskingChars As New List(Of String)(New String() {"#", "?", "@"})

Private DefaultMasks As New ArrayList(New Object() {"", "###.###.#.###", "(###) ###-####", "###-##-###"})

Private _DefMask As CommonMasks

Public Enum CommonMasks

None = 0

IPAddress = 1 '

Phone = 2 '

SSN = 3 '

End Enum

<Bindable(True), Category("Appearance"), DefaultValue(""), Localizable(True)> Public Overrides Property Text() As String


Dim s As String = CStr(ViewState("Text"))

If s Is Nothing Then

Return String.Empty


Return s

End If

End Get

Set(ByVal Value As String)

ViewState("Text") = Value

End Set

End Property

<Bindable(True), Category("Mask"), DefaultValue(""), Localizable(True)> _

Public Property DefaultMask() As CommonMasks


Return _DefMask

End Get

Set(ByVal Value As CommonMasks)

_DefMask = Value

Me.Mask = CStr(DefaultMasks(DirectCast(_DefMask, Integer)))

End Set

End Property

<Bindable(True), Category("Mask"), DefaultValue(""), Localizable(True)> _

Public Property Mask() As String


Dim s As String = CStr(ViewState("Mask"))

If s Is Nothing Then

Return String.Empty


Return s

End If

End Get

Set(ByVal Value As String)

If Value <> "" Then

Dim tempString As String = System.Text.RegularExpressions.Regex.Replace(Value, "\#|\?|\@", "_")

Me.Text = tempString

Me.MaxLength = Value.Length + 1

ViewState("Mask") = Value

End If

End Set

End Property

Protected Overrides Sub RenderContents(ByVal output As HtmlTextWriter)


End Sub

Private Sub MaskedText_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender

Me.Attributes.Add("onkeyup", "processText('" & Me.ClientID & "','" & Me.Mask & "')")

Me.Attributes.Add("onkeydown", "return checkKey('" & Me.ClientID & "','" & Me.Mask & "')")

Me.Page.ClientScript.RegisterClientScriptResource(GetType(MaskingText.MaskedText), "MaskingText.Mask.js")

End Sub

End Class

By just setting the mask property, user can easily use this control.

Things to be note:

1. # sign indicate the Numeric Character.

2. @ sign indicate the Alpha Character, where as

3. ? sign indicates any character.

For example, if user want to mask this textbox for the format "(123)-(ABC)-(1DE)"

the format string will be "(###)-(@@@)-(#@@)"

Very easy to use....!!

Isn't it???

Points of Interest

There are predefined mask also like IPAddress, Phone and SSN, which automatically format the text box.

Hope this will help we (Web Developer) to provide a goof UI.

Have a Happy Programming....!! :)


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Paresh Rathod
Web Developer
India India
My self Paresh Rathod, working as a web developer in Rajkot, Guajrat, India.

I am having total experience of 10 yrs in this field.

I beleive in...

You may also be interested in...

Comments and Discussions

GeneralGood Control Pin
vvasani28-Jun-08 0:49
membervvasani28-Jun-08 0:49 
Hi Paresh,

It a Good Control.



(SEO Services)

Generala few problems Pin
TobyKraft28-Sep-07 4:51
memberTobyKraft28-Sep-07 4:51 
GeneralRe: a few problems Pin
Alan Vu16-Feb-10 11:25
memberAlan Vu16-Feb-10 11:25 
QuestionRe: a few problems Pin
Pavan202010-Mar-13 11:37
memberPavan202010-Mar-13 11:37 
AnswerRe: a few problems Pin
Paresh Rathod10-Mar-13 21:16
memberParesh Rathod10-Mar-13 21:16 
General.NET 1.1 Pin
hutch38316125-Sep-07 2:36
memberhutch38316125-Sep-07 2:36 
GeneralRe: .NET 1.1 Pin
Paresh Rathod25-Sep-07 20:07
memberParesh Rathod25-Sep-07 20:07 
GeneralRe: .NET 1.1 Pin
Nick Kowalewicz27-Sep-07 23:00
memberNick Kowalewicz27-Sep-07 23:00 
QuestionOne Query Pin
Jigar K Oza24-Sep-07 21:08
memberJigar K Oza24-Sep-07 21:08 
AnswerRe: One Query Pin
Paresh Rathod25-Sep-07 0:02
memberParesh Rathod25-Sep-07 0:02 
GeneralRe: One Query Pin
Jigar K Oza25-Sep-07 18:28
memberJigar K Oza25-Sep-07 18:28 
GeneralRe: One Query Pin
Paresh Rathod25-Sep-07 20:06
memberParesh Rathod25-Sep-07 20:06 
GeneralGreat Pin
merlin98121-Sep-07 3:54
membermerlin98121-Sep-07 3:54 
GeneralRe: Great Pin
Paresh Rathod21-Sep-07 4:57
memberParesh Rathod21-Sep-07 4:57 
Generalinteresting.. thanks.. Pin
Michael Sync20-Sep-07 20:37
memberMichael Sync20-Sep-07 20:37 
GeneralRe: interesting.. thanks.. Pin
Paresh Rathod21-Sep-07 0:16
memberParesh Rathod21-Sep-07 0:16 
GeneralRe: interesting.. thanks.. Pin
Michael Sync22-Sep-07 18:46
memberMichael Sync22-Sep-07 18:46 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Terms of Use | Mobile
Web02-2016 | 2.8.180515.1 | Last Updated 21 Sep 2007
Article Copyright 2007 by Paresh Rathod
Everything else Copyright © CodeProject, 1999-2018
Layout: fixed | fluid