95
Views
7
Comments
Solved
[Data Grid Web] [ HowTo ] - Conditional Highlight Rows Based input value
Question
Forge component by OutSystems R&D
41
Published on 18 Nov 2020

Hi Team,

I was looking for samples and previous forum posts but I didn't find, I would like to know how add a conditional cell class but based on page input value.

Example: I have a page with the grid that displays data, and a filter in the top with a date interval.

Goal: I would like to highlight some cells that contain dates within the filtered interval.

How I can implement this feature? This is similar with the colorRenderer available on the Sample however the values to apply the class would be dynamic or passed as input. 


Any idea how to achieve this?

Thank you,

Daniel Martins

Staff
Rank: #3250
Solution

Hi Daniel Martins


Your solution is correct!


We can't add parameters to OSCellRenderer, and considering the grid is rendered by javascript we need to call Range Slider parameters by javascript too.


Don't know if you called the grid.refresh function to apply the CSS classes, but if you don't I prepared a sample for you showing how to do it.


Regards

Ricardo Valim


DataGridCustomColor.oml

Staff
Rank: #64

While I don't get a cleaner solution, I attach one workaround that is to get the input values by class name in the script.

In the sample attached I am using the Range Slider.

DataGridDinamic.oap

Staff
Rank: #64

Hi Ricardo,

Thank you for having a look at this.

Staff
Rank: #64

I didn’t call the grid.refresh do you have a sample?

Staff
Rank: #64

Thank you!

Staff
Rank: #64

My sample is also now available attached.

DataGridDinamic.oap