Styling Html Helpers MVC.Net

Question

If i have a html helper like so:

Name:<br />
<%=Html.TextBox("txtName",20) %><br />

How do i apply a css class to it? Do i have to wrap it in a span? Or do i need to somehow utilize the HtmlAttributes property of the helper?

Answer 1

You can pass it into the TextBox call as a parameter.

Name:<br/>    
<%= Html.TextBox("txtName", "20", new { @class = "hello" }) %>

This line will create a text box with the value 20 and assign the class attribute with the value hello. I put the @ character in front of the class, because class is a reserved keyword. If you want to add other attributes, just separate the key/value pairs with commas.

Answer 2

use the htmlAttributes parameter with anonymous type, like tihs:

<%=Html.TextBox("txtName","20", new { @class = "test"}) %>

Answer 3

Thanks guys I suspected that would be the answer. I'm not sure I'm sold on these helpers, makes the HTML too code intensive. There is something to be said for clean HTML that can be understood my everyone including UI designers.

Answer 4

I did some research and came across this article that seems to have a solution to your question.

Ajax Control Toolkit with ASP.NET MVC#

source: jimzimmerman

ARTICLE LINK

http://www.ajaxprojects.com/ajax/tutorialdetails.php?itemid=330

QUOTE

So basically if you put the class name TextboxWatermark on any textbox input with the title you like to show as the watermark like this:

<input type="text" class"TextboxWatermark" name="username" id="username" title="Must be at least 6 chars" />

or

<%= Html.TextBox("username", new { @class = "TextboxWatermark", @title = "Must be at least 6 chars" }) %>

What is nice about the second option is that you get the added benefit of getting the View Engine to fill out the value of the textbox if there is an item in ViewData of the ViewData.Model that has a var named 'username'.

Answer 5

The HTML Helpers are one of several reasons why we are not adopting MVC. The XML Markup style controls of WebForms work much better when you are working with large teams complete with designers.

Answer 6

@Dan - I feel the same way. I don't use the Html Helpers either. I prefer coding out the html and so do my designers. I like having the full control over my markup compared to using the Html helpers in MVC or using the server side controls in ASP.NET Web Forms. You just can't beat it when it comes to generating fully standard compliant sites that also have to be 508 compliant.

Answer 7

@Jonathan - ASP.NET MVC doesn't tie you to the aspx view engine. That is just what works out of the box. There are plenty of other view engines you can use until you find the one that is comfortable and will get you away from the clunky <% %>. The one I am mostly excited about is Spark. Scott did a post about it, which is how I learned about it. The way the html and code come together seamlessly is very nice.

The others are nVelocity, Brail, and nHaml. All of these have been implemented in the MvCContrib project.

Answer 8

How does this look in VB.net?

<%=Html.CheckBox("Learning", item.Learning, New With {.enabled = False})%>

Answer 9

<%=Html.TextBox("txtName","20", new { @class = "test"}) %>

Is it that much more work?

Answer 10

hmmmm, that just took out all my code.