How to use the <label> tag in ASP.NET?

Question

How can I use the <label> tag within an ASP.NET application? I want it to be valid, accessible, and usable.

I understand the optimal HTML way is this:

<label for="Username">Username:</label> <input type="text" id="Username" runat="server" /> 

But if the above code is in an ASP.NET user control, the input ID will change, meaning the label's "for" attribute is useless. I could make the label tag a server control and set its "for" attribute in the code (Username.ClientID), but it seems like a lot of work for such a simple thing.

I've also seen this HTML used in the past:

<label>     <span>Username</span>     <input type="text" id="Username" runat="server" /> </label> 

What is the proper approach?

Answer 1

I use <asp:Label ... AssociatedControlID="Username" ...> controls for this. They get rendered as <label> tags and set the for attribute appropriately.

Note that you can also nest other tags within the Label control if you wish:

<asp:Label ID="UsernameLabel"            Text="Username:"            AssociatedControlID="UsernameTextBox"            runat="server">     <asp:TextBox ID="UsernameTextBox" runat="server" /> </asp:Label> 

Answer 2

You can also write it like this:

<label for="<%= Username.ClientID %>">Username:</label> <asp:TextBox ID="Username" runat="server" /> 

Phil Haack has a blog post on this topic