Question

I have the following code in a partial view;

        <%= Html.Grid(Model).Columns(column =>
            {
                column.For(model => model.Date).Format("{0:d}");
                column.For(model => model.DayAmount);
                column.For(model => model.LeaveType);
            })
            %></div>
        <p><%= Html.Pager((IPagination)Model)%></p></div>

The latest requirement is to set the colour of the row depening on the leave type.
So I intend to add a colour column to the datatable, say LeaveRowColour.
When I Google search on MVCContrib I notice that maybe I should use the RowAttributes property to set this. But I am not clear how to do this, or whether I should find another solution.

Answer 1

You could write a custom HTML helper to determine the CSS class to apply:

public static class HtmlExtensions
{
    public static string GetLeaveTypeCss(this HtmlHelper html, string leaveType)
    {
        if (leaveType == "Type 1")
        {
            return "t1";
        }
        else if (leaveType == "Type 2")
        {
            return "t2";
        }

        return "defaultType";
    }
}

and then:

<%= Html
    .RowAttributes(model => new Hash(@class => Html.GetLeaveTypeCss(model.Item.LeaveType)))
    .Grid(Model)
    .Columns(column =>
    {
        column.For(model => model.Date).Format("{0:d}");
        column.For(model => model.DayAmount);
        column.For(model => model.LeaveType);
    })
%>