Implementing KPI

[Sagi]

Hi,
We are currntly evaluating KendoUI for our BI solutions.
I do have a question regurding the Grid control.
How can I implement a KPI grid ?
Cant see any cellrenderer event I could attach to in order to have full control on a spesific cell.
We have our on KPI engine which decides on the style of each on of the cells in the grid.
Do you have such a capability ?

Thx
Sagi Karni
Intel Corp.

[Iliana Dyankova]

Hello Sagi,

In order to control the way a single cell in Kendo UI Grid is rendered, you could set a specific template to the grid columns. Also, there is a rowTemplate configuration option, which can be used to customize the presentation of all cells. 

I hope this information helps.

Regards,

Iliana Nikolova
the Telerik team

[Sagi]

Sorry I still dont get how can i determine in runtime that a spesific cell should be colored in red.
Please take a look at jqxGrid at http://www.jqwidgets.com/jquery-widgets-demo/#demos/jqxgrid/defaultfunctionality.htm  (first sample)
you can see that they have cellsrenderer function that is being invoked for every cell.

DO you have something similar ?

Thx

[Iliana Dyankova]

Hello Sagi,

You could achieve this using rowTemplate and some JavaScript code inside this template to check the conditions. For example, the following code snippet could be used to set a red background-color to all of the cells in the grid from this online demo with rating under 4.3:

<script id="rowTemplate" type="text/x-kendo-tmpl">
   <tr>
      <td><img src="${ BoxArt.SmallUrl }" alt="${ Name }" /></td>
      <td>${ Name } </td>
      # if (AverageRating < "4.3") { #
        <td style="background-color: red;">
      # } else { #
        <td>
      # } #
       ${ AverageRating }
        </td>
   </tr>
</script>

For convenience, I created a simple project which illustrates such approach in action.

 

Greetings,
Iliana Nikolova
the Telerik team