We all know the benefits of re-usable components in our applications and User Controls in ASP.Net are an easy way to build reusable components that can be used throughout an entire web application.
Templated User Controls allows us to seperate the controls data from it’s presentation because a Templated User Control does not provide a default user interface.
For example I will show you how to create a templated address control thats allows you to reuse address fields across your web application but leaves the formatting up to the individual page designer to style how they wish.
First we open a new web application in Visual Studio and add a new Web User Control to our solution.
We then add a PlaceHolder control to the User Control which will act as a placeholder for our controls rendered data. Our controls markup looks like this:
Next we switch to our controls code behind and implement all the properties we need for our address control plus one other property that returns a type of ITemplate. Our code behind looks like this:
Now we need to create a container class that will act as our naming container and exposes all the properties of the User Control to the host page. The container class needs to inherit from the Control class and implkements the INamingContainer interface. The class looks like this:
We need to put the following code inside out controls Init event to instantiate our container class and set its properties, instantiate a copy of the controls ITemplate inside the container control and add our container control to the PlaceHolder”s controls collection.
Now we have a fully working Templated User Control we can put this control onto any web page within out web application and set its data. The markup below shows how this is done:
And thats it!
If you want to do the same as this but package the control up into an assembly that can be reused across multiple web applications you need to create a control that inherits from the Control or WebControl class.
It just will not work. there is something missing
Sorry one thing I forgot to put in the post was you need to put DataBind(); in the Page_Load event.
Hi Lee Dale,
I used the above templated user controls in grid view (where paging is enabled).
Two rows are created one on the top of grid view and other on bottom of grid view with lnkbuttons “Delete “,”create”.
The link buttons are working fine in first page and all other pages except the last page
Thanks, this helped!
Thanks so much for that “detail” (I mean DataBind()). It usually doesn’t appear in any place and I was getting mad because I wasn’t able to show container property values.
Would you mind to explain why is this required?
Yeah sure.
We call the DataBind() method of the page to initiate data binding on each of the Page’s controls. Without calling DataBind() explictly on the Page DataBind() will not get called on any of the Pages controls, therefore no data will get bound to the User Control.
In ASP.Net whenever you set the DataSource of a data bound control you need to explicity call either DataBind() on the Page or DataBind() on the specific control who’s data source is being set.
Hope that makes sense.
Hi Thanks for this, it has been very useful.
I get a design-time error on my version of the above (in Vb.Net), which is ‘UserControl’ does not have a public property named ‘ContentTemplate’.
Although the control compiles and runs fine!
I’m just using a placeholder, so that I can put any control (or set of controls) I like in the ContentTemplate.
Any ideas would be much appreciated.
Thanks for this information, Lee. It was very helpful to me.
I alwayse have a “does not have a public property” error message in design time when using templated user controls. Desingner can not render templated controls at all and there is no way to solve this problem.
( Any ideas?
Error 1 AddressControl:Type ‘System.Web.UI.UserControl’ does not have a public property named ‘AddressTemplate’. C:\Documents and Settings\cai\Desktop\WebSite1\ShopCart\usercontrol\Default3.aspx C:\…\ShopCart\
HI, Thanks for this tutorial….Uh…actually , it works fine.. but there is one problem that keeps bothering me……every time I run this code that will run correctly, but this error is always there, I checked the back of “AddressControl.ascx.vb”…it clearly defines the the property of “AddressTemplate” as Public..
OK……I have no idea ……..-_-…
how to show a design time preview ?
Hi, is there any way to download the source code for this example?
thanks a lot in advance
thank you tried it ,it works
I’m having the same problem as geHucKa and allen. Any thoughts?
GetHucka – allen
Seems there is a bug in designer that only looks at the base class instead of the control.
http://msdn.microsoft.com/en-us/library/36574bf6(VS.80).aspx
Not sure if this has been fixed in VS2008, but it sure is giving me a major headache in VS2005
Oh – seems there is an issue with any email address that ends in .ws – using that email address myname@mydomain.ws I kept getting ‘discarded’
This is a good function that will validate ALL known email address formats
Public Function IsValidEmail(ByVal email As String)
Dim isitvalid As Boolean
Dim names, name, i, c
names = Split(email, “@”)
If UBound(names) 1 Then
isitvalid = False
Return isitvalid
Exit Function
End If
For Each name In names
If Len(name) <= 0 Then
isitvalid = False
Return isitvalid
Exit Function
End If
For i = 1 To Len(name)
c = LCase(Mid(name, i, 1))
If InStr(“abcdefghijklmnopqrstuvwxyz_-.”, c) <= 0 And Not IsNumeric(c) Then
isitvalid = False
Return isitvalid
Exit Function
End If
Next
If Left(name, 1) = “.” Or Right(name, 1) = “.” Then
isitvalid = False
Return isitvalid
Exit Function
End If
Next
If InStr(names(1), “.”) <= 0 Then
isitvalid = False
Return isitvalid
Exit Function
End If
i = Len(names(1)) – InStrRev(names(1), “.”)
If i 2 And i 3 Then
isitvalid = False
Return isitvalid
Exit Function
End If
If InStr(email, “..”) > 0 Then
isitvalid = False
Return isitvalid
Exit Function
End If
isitvalid = True
Return isitvalid
End Function
Yeah!
You are great.
I surfed so many articles about CustomControls and none was running except yours!
Thanks very much sir =)
Wow, thanks for the uh, images?
No problem.
First of all thank you for the very good and useful article.
In your sample and in the aspx page you are using label in the template to bind to the properties of the templated user control.
If I want to have them in text boxes and user can modify the values, how can I get the values of those text boxes in the code behind?