If Statement (For CSS Class) on Razor Views

asp.net-mvc, c#, html-helper, razor

Solution

A simple solution would be something like this:

@foreach (var item in Model) 
{
    var style = (item.status == "Unread") ? "font-weight:bold" : "";

    <tr style="@style">
        ...
    </tr>
}

But note, it's generally cleaner to have a separate CSS class, then directly decorate the elements the appropriate class based on its status. For example:

/* css */
tr.status-unread { font-weight: bold; }
...

/* razor */
@foreach (var item in Model) 
{
    <tr class="status-@item.status.ToLowerInvariant()">
        ...
    </tr>
}

Problem

I need to switch between a CSS class depending if the message is read. In simple it should be like this: ``` if (item.status == "Unread") { <tr style="font-weight:bold"> ... } else { <tr> ... } ``` I am having trouble achieving this though. Can something tell me a good to get this done? Should I be using a HTML helper or something? This is the full code so far: ``` @foreach (var item in Model) { if (item.status == "Unread") { <tr style="font-weight:bold"> <td> @Html.DisplayFor(modelItem => item.timestamp) </td> <td> @Html.DisplayFor(modelItem => item.subject) </td> <td> @Html.DisplayFor(modelItem => item.message_text) </td> <td> @Html.DisplayFor(modelItem => item.status) </td> <td> @Html.DisplayFor(modelItem => item.user_sender.username) </td> <td> @Html.DisplayFor(modelItem => item.user_reciever.username) </td> <td> @Html.ActionLink("Edit", "Edit", new { id = item.id }) | @Html.ActionLink("Details", "Details", new { id = item.id }) | @Html.ActionLink("Delete", "Delete", new { id = item.id }) </td> </tr> } } ```

Original source