Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1085
Cell styling difficulties
posted

We are using conditional templating to style cells depending on data present throughout the row.

Our first approach was to apply the style format in the cell:

{{html BdgtCode}}

This works correctly on initial grid rendering, but if we change the value of a cell while the grid is displayed that updates the condition, then it does not work.

I traced this behavior down to the templating code (framework method _renderRow) where it only replaces the contents of the cells, which is fine.

So I changed the cell contents to be a instead, with the conditional formatting on that:

{{html BdgtCode}}

Now the style is applied correctly, but the generated content looks terrible because only the text color is changed, not the whole cell, so there is a large amount of white space, with a tiny bit of color applied to the cell.

So then I changed the cell contents to be a

so that I could apply height and width = 100% in the class.

This is slightly better, but because of the automatic cell margins (4px left and right and 2px top and bottom), these cells appears differently than the rest.

What we need is to dynamically apply a style to an entire cell (the TD part, not the contents).

** Additional Info **

I just tried the method of dynamically replacing the entire cell based on the original blog entry about the templating engine, but this ends up rendering the data incorrectly.

{{if $(BdgtCodeDisabled) == true}}<td class='GridRowRO GCCenter'>{{html BdgtCode}}</td>{{else}}<td class='GCCenter'>{{html BdgtCode}}</td>{{/if}}

Most of the data we are trying to format is numeric and this approach appears to destroy any numeric formatting that is applied to the cells.

  • 37874
    posted

    Hello Karl,

    If you have any further questions, please do not hesitate to ask.

  • 5105
    Suggested Answer
    Offline posted

    Hi there,

    The problem you are facing is connected to the fact that the grid internally splits the templates by the <td> tags in order to get the template for each cell and in this case the internal preprocessing breaks this template. Here's how to rework it in order to get the desired functionality:

     

    <td class='GridRowRO{{if ${BdgtCodeDisabled} == true}} GCCenter{{/if}}'>{{html BdgtCode}}</td>

     

    Let me know if you need any more help with this!

    Thank you for using the Infragistics forums!