I love ASP.NET, but one thing I find extremely frustrating is dealing with the automatically generated ID properties that it places on page elements.

For example, let’s say you have a div with an id of “contentTop” like below:

Because you have made the control a server-side control by adding the runat=”server” attribute it will now be rendered with a different ID when it hits the browser (view the source code and you will see). It will get rendered as something like this:

This is because ASP.NET generates its own IDs to ensure that every element on the page has a unique ID. Developers that work with JavaScript and CSS will immediately see the problem. This causes difficulty when using JavaScript and CSS which rely on those IDs to reference elements, as they can’t easily predict what the generated ID will be. When it comes to CSS specificity the ID selector is extremely useful. In addition, anyone that uses JavaScript knows that getElementById (or one of the JavaScript library ways) is the most popular way to target an element. So why the hell does ASP.NET do this to us? Honestly, I can’t really tell why, other than the fact that they must not trust us enough to be able to uniquely ID our elements ourselves.

But I don’t want to just complain here, I would like to provide some solutions too.

Solution

The solution will be found in the ClientID property of the server-side control. The ClientID property represents the ID that ASP.NET will use for the element on the client.

Using the ScriptManager we place the ClientID in a hidden form field. This can all be done in the code-behind file by using the following code:

Be sure to have included the ScriptManager to your page, like so:

Now we can use JavaScript to retrieve the value from our hidden form fields.

That’s it, if you know of another way, please let us know.
Happy coding.

1. Automatic Properties

Automatic properties provide you with a shorthand for defining a new property. No more do we have to create the private property and then use Getters and Setters to access and set that property. Here’s the old code:
[ASP]
private string _Name;

public string Name
{
get {return _Name;}
set {_Name = value;}
}
[/ASP]

Now here’s the code using automatic properties:
[ASP]
public string Name {get; set;}
[/ASP]

Oh my! How nice is that? The C# compiler creates the Getters and Setters and the private fields for you automagically!

(more…)

Almost every object you create needs to be initialized in some way. In C# 3.0 you now have a new shorthand method for doing so called an object initializer.

Here’s some typical code to initialize an object:

Stud mark = new Stud();
mark.Name = "Mark";
mark.Hotness = 10;


Here’s the new C# 3.0 object initializer way:

mark = new Stud() { Name = "Mark", Hotness = 10 };


This does exactly the same thing as the three lines of code above, but in one line! And the IDE (Visual Studio 2008) even helps out with IntelliSence showing you the fields available. Pretty cool eh? If you’re running Visual Studio 2005, then this won’t work.