575
Views
9
Comments
Solved
[OutSystems Data Grid Web] [ HowTo ] - Conditional Highlight Rows Based input value
Question
outsystems-data-grid-web
Web icon
Forge asset by OutSystems

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

2020-11-26 09-30-54
Ricardo Valim
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
2024-06-12 10-07-10
Daniel Martins

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
2020-11-26 09-30-54
Ricardo Valim
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
2024-06-12 10-07-10
Daniel Martins

Hi Ricardo,

Thank you for having a look at this.

2024-06-12 10-07-10
Daniel Martins

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

2020-11-26 09-30-54
Ricardo Valim

Hi Daniel Martins

Maybe I forgot to add the attachment, sorry. Here it goes again. =)

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

 

 

DataGridCustomColor.oml
2024-06-12 10-07-10
Daniel Martins

Thank you!

2024-06-12 10-07-10
Daniel Martins

My sample is also now available attached.

DataGridDinamic.oap
2018-03-07 11-42-27
Mark Baijens

For future readers, it seems that there is now a way easier way to do this.

See the documentation

2022-11-12 11-28-30
Gonçalo Martins
Staff

Hi @Mark Baijens 

This post is about the Traditional Web version and the link you shared is for the Reactive version so not the right one. For Traditional you can find the sample here but there's not the same use case for conditional formatting (even though you have use cases like "Striped style rows" that use the same principle).

Cheers,
GM


Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.