2012-07-09 3 views
1

데이터베이스에 작업을 저장하고 있습니다. 각 작업은 해결되거나 열릴 수 있으므로 상태에 따라 true 또는 false을 포함하는 열 isSolved을 DB에 만들었습니다.데이터베이스 값에 따라 행 색상 변경

이제 모든 작업 목록을 표시하고 해결 된 작업의 행의 배경색을 녹색으로, 그리고 해결되지 않은 작업을 빨간색으로 설정하고 싶습니다. 그러나 .cshtml 파일 내부에서 어떻게 알 수 있습니까?

답변

6

당신은 뷰 내부의 조건 검사를 수행 할 @()을 사용할 수 있습니다 : 물론 당신은 CSS 규칙이있다.

<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; 
} 
4

상태에 따라 각 요소에 클래스를 추가하십시오.

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

귀하의 TaskVM.Color 재산권이 될 것을

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

와의

처럼 : 당신은 (내가 ul 태그를 사용하지만 다른 태그로 작동) 주 VM에있는 TaskVM 목록을 렌더링하는 가정

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