asp.net-mvc - データベースの値に応じて行の色を変更する

Question

タスクをデータベースに保存しています。各タスクは、解決またはオープンできるので、ステータスに応じて、DB にまたはをisSolved含む列を作成しました。truefalse

ここで、すべてのタスクのリストを表示し、行の背景色を解決済みのタスクの行の背景色を緑に、未解決のタスクの行の背景色を赤に設定したいと考えています。.cshtmlしかし、ファイル内でこれをどのように実現できますか?

Answer 1

を使用し@()て、ビュー内で条件付きチェックを実行できます。

<ul>
 @foreach(var task in Model) // Model is your list of tasks
 {
  <li class="@(task.isSolved ? "solved" : "unsolved")">@task.Description</li>
 }
<ul>

CSS

li.solved
{
   color: green;
}

li.unsolved
{
  color: red;
}

Answer 2

ステータスに応じて各要素にクラスを追加します。TaskVMメイン VM にあるリストをレンダリングしていると仮定します(タグを使用しますulが、他のタグでも機能します)。

<ul>
 @foreach(var task in Model.Tasks)
 {
  <li class="@task.Color" >text</li>
 }
<ul>

あなたのTaskVM.Color財産は次のようになります

public string Color
{
 get { return isSolved ? "Green" : "Red"; }
}

そしてもちろん、CSS ルールがあります。

.Green {
 background-color:#33CC00;
}
.Red {
 background-color:#FF333;
}