[Data Grid Reactive] [Data Grid Reactive] How to get the data out from Data Grid
Forge component by OutSystems R&D

Hi, recently for making an analysis we are using Data Grid component, we really found it useful but how we are using it is in a different approach, for us the data is always different so we can't create entities in the database, we want to use the data grid but directly making sure that user can upload anything he wants for this we used an forge component Excel Translator from were we are directly converting the binary data from upload to JSON it solved our first problem, however now we want to be able to edit the data and also select that data to use it in Alteryx, so we wan to get the data out of grid. We used various methods like API Selection, View, Data actions but we are not able to get the data. Please let us know if there are any ways to edit the data and also get the data out of grid without having the entities creates.

We already used Save Grid view but in this action the problem is if we remove any column and try to save the data, then it doesn't save the data . 

Thanks in advance,



Hello @Pranay Kumar,

What you are trying to achieve is not what the Data Grid was designed to do, but I believe there might be a way, but it will require for you to make some developments.

We manage to create a sample application showing the idea, that will produce this:

In order to achieve this, what we have done:

1. Used the Excel Translator component for forge to read the XLSX file into a JSON

2. Created a regex that gets only the first line, deserialize it and check for the data type. This will create an array with column definitions. Note that the sample has only logic for Number and Text column but the Data Grid has more Column types, you need to implement yourself if you require.

3. The DataGrid columns are created using a List that receives a list of Column definitions. In this case the block inside the List receives the configuration and uses If clauses to determine what column type to render.

4. We also created a mechanism for the page to understand when the columns are created, because, only after that you can bind the data to the Data Grid.

5. The Button to get the data is using the definition to get the data directly from the grid using the JavaScript code
$parameters.Data = JSON.stringify(GridAPI.GridManager.GetGridById($parameters.GridWidgetId).provider.collectionView._src);

In attachment, you can find a sample OML with this implementation.

Please keep in mind that this hasn't been tested for all possible use cases or that it cover all of your requirements, so we cannot assure that it will work for all use cases.

Please let us know if this helps.

Bruno Martinho


Hi Bruno,

Thanks for your quick response we were able to solve the issue. Could you also let us know is there a way to edit the data in grid when we use this approach? because as of now we are not able to do that since we are not creating the entities

Hello @Pranay Kumar ,

In the sample, the Data Grid is loading the information from the Excel, then you can edit the cells in any row and after the save you'll have all that data in JSON format.

If this isn't what you require, can you please explain a little bit more for me to understand?


Bruno Martinho

Hi Bruno,

Yes it's working i'm able to edit the data thanks for your help :)

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