Subscribe

How To Name Controls in ASP.NET Web Forms

When working with ASP.NET, particularly Web Forms up until version 4 of the ASP.NET framework, one might want to think a bit at the naming of the controls used.

I often stumble upon control names looking like this: ChoicesPlaceHolder, MessageLabel and similar. That's clear and decent naming, but it can be improved.

Me and fellow developers have found a simple yet useful and clear naming convention, based on a prefix and a descriptive control name (using Hungarian notation).

This is how it can look instead: phChoices, lblMsg

Naming is particularly important when dealing with nested controls and ContentPlaceHolders. Using better naming, you can improve and reduce this rendered control id:

ctl00_ContentPlaceHolderAllColumns_ContentPlaceHolderAllContentColumns_
ContentPlaceHolderSubNavigation_SubNavigation_RepeaterNavigation_ctl06_
HyperLinkNavigationPageLink

To this id:

ctl00_cphAllColumns_cphAllContentColumns_cphSubNav_SubNav_rptNav_
ctl06_hlNavLnk

Pretty much better, huh? Plus it saves bandwidth.

Also, think twice about where you put runat="server". Is it needed on all controls?

Here's a table with common controls, their prefix and an example naming.

Table: Common ASP.NET Web Forms control and naming
ASP.NET Control Prefix Example
Button btn btnSend
CheckBoxList cbl cblColourCombinations
ContentPlaceHolder cph cphMain
DropDownList ddl ddlNavChoices
Label lbl lblMsg
Literal lit litMsg
Panel pnl pnlLogin
PlaceHolder ph phArticles
RadioButtonList rbl rblPaymentChoices
TextBox tb tbUserName

Comments

1. Daniel Berg on Oct 7th, 2010 09:02 AM
Follow on Twitter or visit website.

This is great for readability. :)

I usually take this naming convention for granted. Then I open up a project where there are controls named like Articles1. I should send them your way, Martin.

Thanks! Keep it up!

2. Marthin Freij on Oct 7th, 2010 11:00 AM
Follow on Twitter or visit website.

Common sense in the Visual Basic 6 world :-)

And don't forget to prefix all the string variables with s and all the integers with i ;-)

3. Kalle Hoppe on Oct 7th, 2010 11:09 AM

Sooo, what do you name a composite control, like a menu? The hole prefixing thing just isn't good enough. It may work for standard controls, but it still not. For starters, why use the control name at all, but if you have to why don't you call things by their right name.
If you have a send button why don't just call it "SendForm", Name for a name TextBox, NameLabel for the label for that TextBox.
It's all about the readability and context the elements are in.

4. Martin Söderlund on Oct 7th, 2010 12:00 PM
Follow on Twitter or visit website.

@Daniel:

Thanks!

@Marthin & Kalle:

Thanks for the input!

I think the most important thing here is to use descriptive names for variables, controls etc. And I can only speak for myself, but I think names like "NameLabel" and "VotePlaceHolder" are a bit too descriptite, thus I promote using prefixes like the ones suggested here.

I'll try to switch to your version just to try it out now, and maybe that will account for a new post in the future.

Write a comment





Or use Twitter to identify


To the top