AssociatedControlID Property in ASP.NET

Introduction

I can see many websites today having no such feature such as when the user clicks on a label control the textbox gets the focus. As you can see in the animated image given below, in the first login set when I clicked on the label control, the text box does not get the focus and the same in another login set, the textbox gets the focus and we can start typing.

Reason: Such websites do not use the AssociatedControlID property.

Use of AssociatedControlID property

We use the AssociatedControlID property to associate a Label control with another server control on a Web form. When a Label control is associated with another server control, its attributes can be used to extend the functionality of the associated control. You can use the Label control as a caption for another control, or you can set the tab index or hot key for an associated control.

When the AssociatedControlID property is set, the Label control renders as an HTML label element, with the for attribute set to the ID property of the associated control. You can set other attributes of the label element using the Label properties. For example, you can use the Text and AccessKey properties to provide the caption and hot key for an associated control.

If you are an ASP.NET guy, you can use:

<asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Username:</asp:Label>
<asp:TextBox ID="UserName" runat="server"></asp:TextBox>

If you are an HTML guy, you can use:

<label for="UserName" id="UserNameLabel">Username:</label>
<input name="UserName" type="text" id="UserName" />

Which means that in ASP.NET we use the AssociatedControlID property and in HTML we use the "for" attribute for the same result.