[Data Grid Sample] [Data Grid Sample] Extending DataGrid for Check and Uncheck Checkbox Selection on Cel

Forge Component
Published on 3 Aug (3 days ago) by OutSystems R&D
14 votes
Published on 3 Aug (3 days ago) by OutSystems R&D

If there is a requirement to check or uncheck the checkbox selection from a specific row when there is an edit on a cell from that same row, it is possible to extend the default DataGrid behavior.

Following the expected results:

  1. When the user edits a cell from a specific row, it automatically sets the checkbox to “checked”.
  2. When an undo is applied after the previous step, it will change the checkbox to “not checked”

The previous points got us into different scenarios:

  3.  If the user clicks on the “Select-All” checkbox, it will be impossible to toggle the selection of the rows until he clicks once again on “Select-All” checkbox (this time to clear selection).

Here you can see that if the user clicks on Select All checkbox, any changes that occur on a cell won’t affect the selection.

   4.  Similar to the previous point, if the user wants to toggle checkbox selection again with the undo changes on cells, the solution passes by unchecking everything back. This will enable the feature again. Otherwise, the previous point (3rd point) will continue ruling.

   5.  If there are multiple dirty cells on a specific row, the user has to undo them until there is now dirty cell, only after this the row’s checkbox will get unchecked.

You can check how to extend the DataGrid in the sample attached in the post, just download the .oml file. Then you will find a Source Web Block containing all the Javascript to extend DataGrid for these requirements. You can find the Javascript inside a JS Web Block. Double click ToggleCheckbox to find it.As this is a Sample to illustrate the behavior of this feature, there is a checkbox at the top that will change the value of a variable - Override, from ToggleCheckbox and conditionally use the JS Web Block.

Remember that by using this feature, the methods related to dirty marks on the cells after changing their values and selection by checkbox will get overwritten. Specifically, the methods setDirtyCell and columnSelectRow.

Hope this sample is useful if you need to extend DataGrid to check and uncheck checkbox selection on cell edition.

Yes thanks for sharing this.