ASP.NET MVC – Add CSS class Attribute

If you are a web developer, you probably are used to using the standard “class” attribute in your HTML. If you typically use ASP.NET Web Forms, you are probably used to using the CssClass property on your web server controls. But, if you are new to ASP.NET MVC like me, you may be surprised to learn that the HtmlHelper extension methods do not explicitly provide a parameter for your styling needs.  Instead, if you are using C#, you need to use the object initializer syntax introduced in C# 3.0. To cut to the chase, adding a “class” attribute to an input element generated by a HtmlHelper extension method looks like this:

<%= Html.TextBox(”myTextBox”, null, new{@class = “required”}) %>

Please notice how @class is in bold. The reason for this is because the @ prefix is necessary in this specific case because class is a keyword in C#. If you omit the @ prefix, you will receive a compile time error that says:

The reasons for wanting to add CSS class information to your HTML elements are numerous. You may simply want to stylize your HTML elements. Or, you may want to prepare your elements to work with a JavaScript framework like JQuery. Regardless of the reason, if you would like to learn more about ASP.MVC, I recommend ASP.NET MVC in Action (or you could just skip MVC and learn Silverlight ). As someone that has traditionally written applications using the ASP.NET Web Forms approach I hope to write more about the challenges I come across. What challenges are you experiencing in ASP.NET MVC that you were comfortable overcoming with the ASP.NET Web Forms style?

blog comments powered by Disqus