在System.Web.Helpers.WebGrid中定义内联行样式

Question

我正在将我的应用程序移动到MVC 3并尝试使用System.Web.Helpers.WebGrid.我想得到如下的HTML代码:

<table>
    <tr style="background-color: <%= item.Color %>">
    </tr>
    <tr style="background-color: <%= item.Color %>">
    </tr>
    <tr style="background-color: <%= item.Color %>">
    </tr>
</table>

有rowStyle属性,允许为每一行定义css类,但每行都有不同的样式.它容易实现吗？

Answer 1

所以我必须完成黑客攻击.首先,将颜色包含在另一列的一部分中.必须返回它MvcHtmlString以避免其他编码:

<%  
    var grid = new WebGrid(Model);
%>
<%= 
    grid.GetHtml(
        tableStyle: "table_class",
        columns:  grid.Columns(
            grid.Column("Importance", CTRes.Importance, (item) => 
                new MvcHtmlString(Html.Encode(item.Importance) + 
                "<div class='color' style='display: none;'>#" + item.Color + "</div>"))
        )
    ) 
%>

然后我们设置bacground颜色$(document).ready():

<script type="text/javascript">
    $(document).ready(
        function () {
            $('.table_class .color').each(function (index, element) { $(element).parent().parent().css('background-color', $(element).html()); });
        }
    );
</script>