I this post I will try to explain the difference between those three commonly used properties. Each property is described in a separate section. Attached you can find a sample web site as well as two screenshots visually depicting the difference between the ID, ClientID and UniqueID properties.
property is used to assign an identifier to an ASP.NET server control which can be later used to access that control. You can use either the field generated in the codebehind or pass the value of the ID property to the FindControl
method. There is a catch though - the ID property is unique only within the current NamingContainer
(page, user control, control with item template etc). If a server control is defined inside the item template of some other control (Repeater, DataGrid) or user control, its ID property is no longer unique. For example, you can add some user control twice in the same page. Any child controls of that user control will have the same ID. Also the ASP.NET page parser won’t generate a codebehind field corresponding to the control ID in case the control is defined inside a template. This is the reason you cannot easily find a specific control when it is part of a template - you need to use the FindControl method of its container control instead. As a side note, setting the ID property is not mandatory. If you don’t set it the ASP.NET Runtime will generate one for you in the form of “_ctl0”, “_ctl1”, etc.
The UniqueID property is the page-wide unique identifier of an ASP.NET server control. Its uniqueness is guaranteed by prefixing the ID of a server control with the ID of its NamingContainer. If the NamingContainer is the Page the UniqueID will remain the same as the ID.
For example if a Label with ID="Label1" is defined in a user control with ID = "UserControl1" the UniqueID of the Label will be "UserControl1$Label1". Adding another instance of the same user control (with ID = "UserControl2") will make the UniqueID of its child label to be "UserControl2$Label1".
The UniqueID property is also used to provide value for the HTML "name" attribute of input fields (checkboxes, dropdown lists, and hidden fields). UniqueID also plays major role in postbacks. The UniqueID property of a server control, which supports postbacks, provides data for the __EVENTTARGET hidden field. The ASP.NET Runtime then uses the __EVENTTARGET field to find the control which triggered the postback and then calls its RaisePostBackEvent method. Here is some code which illustrates the idea:
IPostBackEventHandler postBackInitiator =
Page.FindControl(Request.Form["__EVENTTARGET") As IPostBackEventHandler;
if (postBackInitiator != null)
You can use the UniqueID property to find any control no matter how deep it is nested in the control hierarchy. Just pass its value to the FindControl method of the Page.
property is quite similar to the UniqueID. It is generated following the same rules (the ID of the control prefixed by the ID of its NamingContainer). The only difference is the separator - for the ClientID it is the "_" (underscore) symbol.
The ClientID property is globally unique among all controls defined in an ASP.NET page. You may ask why we need two different globally unique properties. The answer is that ClientID serves a different purpose than UniqueID. In most server controls the ClientID property provides the value for the HTML "id
" attribute of the HTML tag of that server control. For example this:
<asp:Label ID="Label1" Text="Label" />
will render as this:
var label = document.getElementById("<%= Label1.ClientID%>");
which in turn renders as:
var label = document.getElementById("Label1");
That’s why you should prefer using the "<%=
Label1.ClientID%>" syntax to get the client-side id of server controls.
Additionaly the ClientID is used in ASP.NET Ajax as the unique
var control = $find("<%= MyControl1.ClientID %>");
I have attached a sample web site which
demonstrates the difference between those three properties of controls defined in a page (without a master), master page, content placeholder and user control. Here are two screenshots from the output:
Normal ASPX page (without a master page):
Master page scenario:
I hope this helps.