根據數據庫中的單元格值（減號/加號）更改表格行中的顏色

Question

我已經做了一個歷史交易表。 在我的事務數據庫中，我有一個名為 QuantityChange 的列。 值可以是負數或正數。

我想將行顏色設置為紅色，如果它是負值，如果是正值（或零），則為綠色。

什么是最好的解決方案？

<table class="table">
<thead>
    <tr>
        <th>
            Date
        </th>
        <th>
            Storage
        </th>
        <th>
            Product
        </th>
        <th>
            Quantity change
        </th>

    </tr>
</thead>
<tbody>

    @foreach (var item in Model)
    {

        <tr class="@item.QuantityChange">
            <td>
                @Html.DisplayFor(modelItem => item.Date)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Stock.Storage.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Stock.Product.Name)
            </td>
            <td>
                @if (item.QuantityChange > 0)
              {

                    @Html.DisplayFor(modelItem => item.QuantityChange, new { 
style = "color:#00ff00" })

                }
                else
                {
                    @Html.DisplayFor(modelItem => item.QuantityChange, new { 
style = "color:#ff0000" })

                }
            </td>
        </tr>
    }
</tbody>
</table>

Answer 1

這可能是您的解決方案。

@foreach (var item in Model)
{
    <tr style="color:@(item.QuantityChange >= 0 ? "#00ff00" : "#ff0000")">
        <!-- insert other columns here -->
        <td> <!-- this has been modified -->
            @Html.DisplayFor(modelItem => item.QuantityChange)
        </td>
    </tr>
}

Answer 2

嘗試這個

@{
    String color;
}

並在您的表格中根據需要為每個元素添加樣式。

@foreach (var item in Model)
{
    <tr>
    @{
        switch((item.QuantityChange)
        {
            case >0:
                color:"#00ff00";
                break;
            default:
                color:"color:#ff0000";
                break;
        }
    <td style="color:@color">
        @Html.DisplayFor(modelItem => item.QuantityChange)
    </td>