Click here to Skip to main content
15,868,164 members
Articles / Web Development / ASP.NET

Phone TextBox Control with Built-in Phone Validator - ASP.NET Custom Control

Rate me:
Please Sign up or sign in to vote.
3.90/5 (8 votes)
28 Apr 2008CPOL2 min read 55.7K   1K   16   7
Discussing the creation of custom Phone TextBox and its built-in PhoneValidator that validates a group of textboxes which represents three sections of a phone number. It inherits the BaseValidator and uses some new cool ASP.NET AJAX 3.5 features.
Library

Introduction

Sometimes it is troublesome to create a textbox for each section of a phone number and often, it requires a set of validators to validate a phone number that consists of three textboxes. In this case, as a developer, you will need to drag three textboxes to your page and drag a RequiredFieldValidator and a RegularExpressValidator for each textbox. Then, you need to specify "ControlToValidate", "Display", "ErrorMessage," "Text", ValidationGroup" and "ValidateExpression" (if it is a RegularExpression validator) properties for each validator. You could probably end up with some properties being set incorrectly after you went through all this trouble and try to test it. As a result of the time wasting experience, I decided to create a custom PhoneTextBox with built-in PhoneValidator control.

Background

After I decided to create such server controls, problems started floating above the surface. The first thing that I found out is how to create a validator that would validate multiple controls. Secondly, it is a known fact that ASP.NET validators can only show one error message. With the design that I have in mind, I need to find a way to somehow plug in additional error messages for each scenario. In this case, I will need to be able to show two kind of messages in this PhoneValidator, such as InvalidPhoneNumber and MissingPhoneNumber.

To cut a long story short, I eventually figured out how to do it. If you would like to know in details, please go to my blog.

Using the Code

The way to use this control is just like any other stardard ASP.NET server control. To make the drag and drop controls from your own assembly, you need to add the following line to the web.config file under system.web/pages/controls:

XML
<add tagPrefix="Library" namespace="Library" assembly="Library" /> 

Here is an example:

ASP.NET
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
<style>
    #form {clear: both;}
    #form label {float: left;margin-right: 10px;}
    #form .phone {float: left;}
    #form br {float: left;}
    #form a {float: left;}
</style>
</head>
<body>
    <form id="form1" runat="server">
        <div id="form">
            <asp:scriptmanager id="ScriptManager1" runat="server"></asp:scriptmanager>
            <asp:validationsummary id="ValidationSummary1" 
			runat="server" validationgroup="test" />
            <label for="PhoneTextBox1">Phone</label>
            <library:phonetextbox id="PhoneTextBox1" 
		cssclass="phone" validationgroup="test" runat="server" 
		isrequired="True" /><br /><br />
            <asp:linkbutton id="LinkButton1" validationgroup="test" 
		runat="server" text="Submit" /> 
        </div>
    </form>
</body>
</html>   

Conclusion

I wish this small amount of coding will help you in saving your time to do other more important programming. If you like this article, then please remember to vote. If you have any suggestions, bugs to report, or enhancements, please share them with me! Thanks!

History

  • 04/29/2008 - Uploaded the first edition

License

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


Written By
Software Developer (Senior) Bibles for America
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions

 
GeneralCustom PhoneTextBox Control Pin
JMooreWeb4-Nov-09 8:35
JMooreWeb4-Nov-09 8:35 
GeneralRe: Custom PhoneTextBox Control Pin
JMooreWeb4-Nov-09 8:53
JMooreWeb4-Nov-09 8:53 
GeneralBug fixes Pin
OriAlmog23-Oct-08 3:47
OriAlmog23-Oct-08 3:47 
Hi Enoch
Great project, really useful! Smile | :)

Just a couple of changes where needed to use the control in container controls and have mulitple instances of the control as follows

in CreateChildControls() of PhoneTextBox control
Change
_tbxAreaCode.ID = "_tbxAreaCode"
...

To
_tbxAreaCode.ID =  Me.ID + "_tbxAreaCode"
...


And replace all intances of
Page.FindControl

to
Parent.FindControl

GeneralRe: Bug fixes for Multiple Controls on Page Pin
JMooreWeb4-Nov-09 8:52
JMooreWeb4-Nov-09 8:52 
GeneralRe: Bug fixes for Multiple Controls on Page Pin
LMoody1-Feb-10 11:15
LMoody1-Feb-10 11:15 
Generalwell I find this useless... Pin
Seishin#28-Apr-08 23:12
Seishin#28-Apr-08 23:12 
AnswerRe: well I find this useless... Pin
Enoch Tsai29-Apr-08 5:29
Enoch Tsai29-Apr-08 5:29 

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.