19
Views
5
Comments
Solved
[Data Grid Web] Event on mouse click
Forge component by OutSystems R&D
41
Published on 18 Nov 2020
Application Type
Traditional Web

On the follow up of [DataGrid] Losing selected lines on right click, I'm looking for catching the event of selecting a single cell in the DataGrid. This event then needs to 'select' the rest of the row. Any suggestions?

Regards,

Sven

Staff
Rank: #1221
Solution

Hello Sven Persijn,

On the follow up of [DataGrid] Losing selected lines on right click and following the requirement that you asked in order to have a blue overlay on the row of the cell that you are selecting, here goes a workaround solution in a sample format just to illustrate how you can accomplish that specific behaviour. Can you please check the sample attached to this message?

As a workaround, you can use the sample as an example. You will need to include a Web Block containing the methods that you want to replace in order to have the overlay on the rows. (This block is included in the sample attached)

Inside the Web Block you can see that we have a Javascript block containing two methods. Right now the only way we have to create the behaviour that you want is by overwriting two methods from our component.

GridOS.DataFeature.loadFeatures
GridOS.ExtendedFeatures.ExtendedSelectionManager

So please note that the methods mentioned above are getting overwritten.
Feel free to change or create your own method.

We also need to add a class into the css from the sample:
This class will be responsible for the color that is going to be on the row's overlay after selecting a cell. You can change the color by changing the background property.

Hope this sample is useful if you need to extend DataGrid to add a color overlay on top of the rows where a cell has been selected.

Thank you,

Tiago Pereira

DataGridOverlayRows.oml

Staff
Rank: #1221

Hello Sven Persijn,

By "selecting the rest of the row" you mean that you want to select the row like you can select when you select by checkbox/row number? Or just create a blue overlay on the cells from that row?

Thank you,

Tiago Pereira

Rank: #3197

Hello Tiago,

Creating a blue overlay is good enough.

Regards,

Sven

Staff
Rank: #1221
Solution

Hello Sven Persijn,

On the follow up of [DataGrid] Losing selected lines on right click and following the requirement that you asked in order to have a blue overlay on the row of the cell that you are selecting, here goes a workaround solution in a sample format just to illustrate how you can accomplish that specific behaviour. Can you please check the sample attached to this message?

As a workaround, you can use the sample as an example. You will need to include a Web Block containing the methods that you want to replace in order to have the overlay on the rows. (This block is included in the sample attached)

Inside the Web Block you can see that we have a Javascript block containing two methods. Right now the only way we have to create the behaviour that you want is by overwriting two methods from our component.

GridOS.DataFeature.loadFeatures
GridOS.ExtendedFeatures.ExtendedSelectionManager

So please note that the methods mentioned above are getting overwritten.
Feel free to change or create your own method.

We also need to add a class into the css from the sample:
This class will be responsible for the color that is going to be on the row's overlay after selecting a cell. You can change the color by changing the background property.

Hope this sample is useful if you need to extend DataGrid to add a color overlay on top of the rows where a cell has been selected.

Thank you,

Tiago Pereira

DataGridOverlayRows.oml

Rank: #3197

Hi Tiago,
Once again, thanks a lot for the answer. This is what the customer wants!

Regards,

Sven