How to add Html inside ASP.NET MVC 3 WebGrid Column Name (Header)

Question

I am unable to add html inside WebGrid column name(at header)? When I add html inside column name then webgrid encodes that. Is this is not possible to add html inside WebGrid column name?

Answer 1

There is a method to change html generated by an MVC Helper, but it's not very comfortable. In general you can write this command:

@( new HtmlString( Component.HelperMethod().ToHtmlString().Replace("[replacetag]", "My Content")) )

Here is an example using a grid component:

<div id="grid">
    @(new HtmlString(
        grid.GetHtml(
        tableStyle: "grid",
        headerStyle: "header",
        rowStyle: "row",
        footerStyle: "footer",
        alternatingRowStyle: "altRow",
        columns: grid.Columns(
                     grid.Column("Name", "[replacethis]"),
                     grid.Column("Surname", "Surname"),
                     grid.Column("Email", "Sender Email"),
                     grid.Column("Id", "", format: (item) => item.GetSelectLink("Select"), canSort: false))
).ToHtmlString().Replace("[replacethis]", "<b>Name</b>")
)
)    
</div>

Answer 2

I don't think that there is a way to directly write HTML in the header of a WebGrid. One possible workaround is to append the desired with client side javascript.