Question

I have a boolean property IsActive. In the view is a list of objects with their properties (including IsActive). But in the list the IsActive is a non-editable checkbox since it’s boolean. If I change DisplayFor() to DisplayTextFor() then it will just display True or false instead of checkbox. How can I change True and false to ‘Active’ and ‘Inactive’ where Active is true and Inactive is false?

      @Html.DisplayTextFor(modelItem => item.IsActive) 

And then I would style the ‘Active’ to green and ‘Inactive’ to red

Answer 1

You can use a display template to format the way your property is displayed.

Create a DisplayTemplates folder either under ~/Shared or in the View folder where the view that will be using this template exists.

Add a new partial view to this folder. Name it anything you’d like, e.g. IsActive.cshtml

@model bool
@if (Model == true)
{
    @Html.Encode("Active")
}
@if (Model == false)
{
    @Html.Encode("Inactive")
}

Now add data annotation to your property to let it know to use this display template.

[UIHint("IsActive")]
public bool IsActive { get; set; }

Use Html.DisplayFor on any bool with this annotation and it will be formatted according to the display template with the matching name. With some tweaking, you can place the color change style directly in your display template.