3

我刚开始使用 Webmatrix，我正在尝试将 HTML 表格转换为 webgrid。数据来自数据库，我想根据项目内容更改每个 td（在一列内）的 css 类。

例如，如果项目包含“，”则应用 class="multi"，如果它不包含“，”并且不为 null，则 class="single"，否则为“none”。 

<td class="multi">
<td class="single">
<td class="none">

我已经尝试使用 webgrid样式：和格式：设置，但我无法根据项目的值切换类名。我想我只需要正确的语法就可以开始了。

我希望你能在这里帮助我。谢谢你。

4

1 回答 1

3

如果您想使用 WebGrid，您唯一真正的选择是在td渲染后通过 Javascript 根据单元格值设置样式。该style参数将仅接受表示要应用的 CSS 类的字符串。

或者，您可以根据值有条件地设置参数中的内容，用 aformat填充或然后您可以设置样式，例如：tdspandiv

<style>
    td.nopadding{padding: 0;margin: 0;}
    .green{background-color:green;display: inline-block;width: 100%;height: 100%;}
    .yellow{background-color:yellow;display: inline-block;width: 100%;height: 100%;}
</style>
<div id="grid">
    @grid.GetHtml(    
        tableStyle : "table",
        alternatingRowStyle : "alternate",
        headerStyle : "header",
        columns: grid.Columns(
            grid.Column("Country", style: "nopadding", format: @<text>@Html.Raw(item.Country == "USA" ? 
                                                                 "<span class=\"green\">" + item.Country +"</span>" : 
                                                                 "<span class=\"yellow\">" + item.Country +"</span>")</text>))
    )
</div>

更新：以下代码说明了格式参数中包含的更复杂的 if..else 语句：

format: @<text>@if(item.YourProperty == null){
                  @Html.Raw("<span class=\"none\">" + some_value +"</span>")
                  }
                  else{
                    if(item.YourProperty.Contains(",")){
                         @Html.Raw("<span class=\"multi\">" + some_value +"</span>")
                    }
                    else{
                        @Html.Raw("<span class=\"single\">" + some_value +"</span>")
                    }
               }
               </text>
于 2013-07-31T09:28:06.843 回答