如何在ASP.NET Kendo Grid中根据字段值设置条件样式？

你的代码不生效是因为HtmlAttributes是服务器端生成的属性，无法解析客户端的# if #模板逻辑，必须通过模板方法实现行级条件渲染，以下两种方案都可以解决问题：

方法1：服务器端模板（Template） #

直接在服务器端渲染时判断模型值，生成对应样式的HTML：

columns.Bound(c => c.ProviderLiteral)
       .Template(@<text>
           @if (item.ServiceStatusId == 5)
           {
               <span style="text-decoration: line-through;" class="Assignment_Courses_Grid_Item_Center FontSize10">@item.ProviderLiteral</span>
           }
           else
           {
               <span class="Assignment_Courses_Grid_Item_Center FontSize10">@item.ProviderLiteral</span>
           }
       </text>)
       .Title(Resources.Ces.MyTasksPrograms_Grid_Header_Provider)
       .HeaderHtmlAttributes(new { @class = "Assignment_Courses_Grid_Header_Center" });

方法2：客户端模板（ClientTemplate） #

在客户端浏览器渲染表格时，通过Kendo模板语法判断行数据：

columns.Bound(c => c.ProviderLiteral)
       .ClientTemplate("# if (ServiceStatusId == 5) { #" +
                       "<span style='text-decoration: line-through;' class='Assignment_Courses_Grid_Item_Center FontSize10'>#= ProviderLiteral #</span>" +
                       "# } else { #" +
                       "<span class='Assignment_Courses_Grid_Item_Center FontSize10'>#= ProviderLiteral #</span>" +
                       "# } #")
       .Title(Resources.Ces.MyTasksPrograms_Grid_Header_Provider)
       .HeaderHtmlAttributes(new { @class = "Assignment_Courses_Grid_Header_Center" });

两种方案的区别：

• 服务器端模板适合数据绑定后不需要动态修改的场景，HTML直接在服务器生成
• 客户端模板适合分页、筛选等需要动态重新渲染数据的场景，逻辑在浏览器端执行

内容的提问来源于stack exchange，提问作者Wail