如何根据mvc kendo ui网格中绑定列的客户端模板的值设置类样式?

时间:2014-07-16 16:00:21

标签: jquery asp.net-mvc-4 kendo-ui

我想我正在寻找条件造型。如果某列的值为true,我想在绑定列中为客户端模板使用一个css类。如果为false,则设置另一个。

我拥有(基于StartEnabled的bool值的三元语句):

columns.Template(e => e.ConfirmationNumber).ClientTemplate("<button id='btnStartStop_#= ConfirmationNumber #'  #= StartEnabled ? class='btnStartClock':'' # onclick='StartStopPSAClock(#= ConfirmationNumber #, \"#= Description #\", \"#= e.SequenceNumber #\")'>Start</button>");

在visual studio端抛出错误。 感谢您的帮助,谢谢。

1 个答案:

答案 0 :(得分:1)

我最近一直在使用客户端模板化,并且发现复杂项目更容易将其拉出到javascript函数中然后返回渲染结果。

这里有一些我应该为你工作的东西显然会根据你的数据类型改变它但我在这里假设了几件事。

<script>
    function StyledButton(confirmationnumber, startEnabled, Description, SequenceNumber) {

        var returnString = "<button id='btnStartStop_" + confirmationnumber + "'";

        if (startEnabled === true) {
            returnString = returnString + " class='btnStartClock'";
        }

        returnString = returnString + " onclick='StartStopPSAClock(" + confirmationnumber + ", \"" + Description + "\", " + SequenceNumber + ")'>Start</button>";


        return returnString;

    }

</script>

然后运行它只需将客户端模板更改为:

columns.Template(e => e.ConfirmationNumber)
.ClientTemplate("#=StyledButton(data.ConfirmationNumber,data.StartEnabled , data.Description , data.SequenceNumber  )#"); 

然后根据需要渲染按钮。

正如我所说,我发现这种方法更易于管理javascript,而不必试图找出内联的javascript字符串。