Asp.Net MVC 3 WebGrid, как выделить несколько строк?

Question

У меня есть модель:

List<Customer> Customers = New List<Customer>();
Customers.Add(new Customer {Name = "Facebook", Age = 5});
Customers.Add(new Customer {Name = "Microsoft", Age = 30});
Customers.Add(new Customer {Name = "Google", Age = 5});

В WebGrid с использованием движка Razor я хочу изменить цвет фона строк на «красный», если возраст = 5?

Спасибо, Ашраф.

Answer 1

Использование комбинации javascript и некоторой логики на стороне сервера. Я думаю, что они могут быть лучшим решением, однако следующее работает. Идея состоит в том, чтобы установить класс css для элемента строки, когда указанное условие действительно. Затем, используя некоторый JavaScript-код на стороне клиента, найдите строки, которые должны быть красного цвета, и установите CSS для класса

.

@{
      var grid = new WebGrid(source: Model,
          defaultSort: "Name",
          rowsPerPage: 3);
  }
  <div id="grid">
   @grid.GetHtml(
       tableStyle: "grid",
       headerStyle: "head",
       alternatingRowStyle: "alt",
       columns: grid.Columns(
       grid.Column(
       columnName:"Age", 
       header:"Company Age",      
       format: (item) => 
       {
           var css = @"class=""overdue""" ;
           if ((int)item.Age != 5) 
           {
               css = "";
           }
           return Html.Raw("<span " + css + ">" + @item.Age + "</span>");  
       }),
           grid.Column("Name")
      )
   )
  </div>


  <script type="text/javascript">
      $(function () {
          $("#grid tr").each(function () {

              var shouldBeRed = $(this).find(".overdue");

              if (shouldBeRed.length > 0) {
                  alert($(this).html());
                  $(this).attr("class", "redRow");
              }
           });
      });
  </script>