Highlight Table Row based on some Condition in ASP.NET Core

READ ALSO

Model Class

public class Products
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public int Price { get; set; }
    }

Controller Code 

public IActionResult Index()
        {
            List<Products> p1 = new List<Products>();
            p1.Add(new Products { Id = 1, Name = "Samsung", Price = 50 });
            p1.Add(new Products { Id = 2, Name = "Samsung1", Price = 50 });
            p1.Add(new Products { Id = 3, Name = "Samsung2", Price = 150 });
            p1.Add(new Products { Id = 4, Name = "Samsung3", Price = 150 });
            p1.Add(new Products { Id = 5, Name = "Samsung4", Price = 550 });
            p1.Add(new Products { Id = 6, Name = "Samsung5", Price = 550 });
            return View(p1);
        }

View Section

@model IEnumerable<TestingApplication.Models.Products>

@{
    ViewData["Title"] = "Index";
}

<h2>Index</h2>

<p>
    <a asp-action="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Id)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            @if (item.Price > 0 && item.Price < 100)
            {
                <tr class="label-success">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
            @if (item.Price > 100 && item.Price < 200)
            {
                <tr class="label-warning">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
            @if (item.Price > 150 && item.Price < 600)
            {
                <tr class="label-primary">
                    <td>

                        @Html.DisplayFor(modelItem => item.Id)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Name)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Price)
                    </td>
                    <td>
                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |
                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                    </td>
                </tr>
            }
        }
    </tbody>
</table>

Jacob
- June 28, 2018

Read other related articles

Also read other articles