As we have discussed how to build the rendered control earlier, it is one step ahead in building custom controls. Earlier we have built the custom control starting from scratch. If you don’t want to start from scratch when building a custom control, you can build a composite control. When you create a composite control, you create a new control from existing controls.
Every ASP.NET control has a Controls property that represents all of its child controls. If you add child controls to a control, then the child controls are automatically rendered when the parent control is rendered.
Lets start from the beginning, Creating NumericTextBox (Only accepts Numeric values, else it give error message through validator.) is shown below. Create new VB Web Application Project and let’s name it NHSWebApplication. After Creating Web Application project just right click on App_Code folder (if not in solution then first create folder named App_Code) and add one class file named NumericTextBox.vb.
Note: Any code added to the App_Code folder is compiled dynamically.
The Code of NumericTextBox.vb file is as shown below
Namespace NHSWebApplication
Public Class NumericTextBox
”Inherit the control from Base Class CompositeControl
Inherits CompositeControl
”Declaring TextBox Web Control
Private NumericTextBox As TextBox
”Declaring ReqularExpressionValidator Web Control
Private NumericExpressionValidator As RegularExpressionValidator
”Overriding CreateChildControlMethod
Protected Overrides Sub CreateChildControls()
”Instanciate TextBox Control
NumericTextBox = New TextBox
”Assigning ID to text box control
NumericTextBox.ID = “txtNumericTextBox”
”Adding control
Me.Controls.Add(NumericTextBox)
”Instanciate RegularExpression Control
NumericExpressionValidator = New RegularExpressionValidator
”Assigning ID to RegularExpressionValidator Control
NumericExpressionValidator.ID = “vdtNumericExpressionValidator”
”Assigning Basic Properties to RegularExpressionValidator
NumericExpressionValidator.ControlToValidate = “txtNumericTextBox”
NumericExpressionValidator.ValidationExpression = “[0-9]*”
NumericExpressionValidator.ErrorMessage = “Invalid Inputs”
NumericExpressionValidator.Display = ValidatorDisplay.Dynamic
”Adding Cotnrol
Me.Controls.Add(NumericExpressionValidator)
End Sub
End Class
End Namespace
Here Class NumericTextBox is inherited from the base class CompositeControl. Two webcontrols Textbox and RegularExpressioValidator are declared.
Typically one has to override a control’s CreateChildControls() method. This method is called when a control builds its collection of child controls. In this method the objects of Textbox and RegularExpressionValidator are initialized and the some of the properties are set in order to get desired output.
”Assigning ID to text box control
NumericTextBox.ID = “txtNumericTextBox”
”Assigning ID to RegularExpressionValidator Control
NumericExpressionValidator.ID = “vdtNumericExpressionValidator”
”ID of controls that needs to be validate
NumericExpressionValidator.ControlToValidate = “txtNumericTextBox”
” Regular Expression that only accepts numeric values (0 to 9)
NumericExpressionValidator.ValidationExpression = “[0-9]*”
” Informative Message that needs to display on wrong input
NumericExpressionValidator.ErrorMessage = “Invalid Inputs”
Now just build your application and then add new Web Form. Let’s say TestCustomControl.aspx. Open its design view or HTML view and see the Toolbox. You will find the custom control named NumericTextBox. Just drag it on Design view or html code. See sample code of ASPX Page below.
<html xmlns=”http://www.w3.org/1999/xhtml” >
<head runat=”server”>
<title>Testing Composite Control</title>
</head>
<body>
<form id=”form1″ runat=”server”>
<div>
<cc2:NumericTextBox ID=”NumericTextBox1″ runat=”server” />
</div>
</form>
</body>
</html>
It will render the Textbox in browser with RegularExpressionValidator. The regular expression restict user to input non-numeric values. If any non-numeric values entered in textbox then it will show message ‘Invalid Inputs’. Here in this example, the message is kept static. You can always make it dynamic by creating properties of composite control and passed it from HTML.
By extending the properties of existing web control you can create more helpful composite controls. Hope this article will help to understand building custom composite control.
The site is very hard to read.
Don’t you think?
I totally agree. Way too hard to read that code.
Untuk melihat List Jaringan Iklan kami, bisa di cek di menu Jaringan Kami