Hi everyone,
I have created a form where, I am using a multi-page wizard so in my first page (let's call it, page1) I have a data-grid component (lets call it DG1) and in another page (page2) I have another data-grid component (DG2) , page2 is more like an overview page, so I want to display the data from DG1 on the DG2 component automatically (basically, whatever fields i have selected (in the share-point component values) and typed in the text-field or number component, I want them to be displayed). Is it possible to achieve it, If yes, how should i go for it.
Moreover, I have another form where I have a data-grid component inside it I have a number and text field component , I want both of them to behave like if the user has written anything in those fields in the first row of the data-grid component I want the second row of data-grid component to have the same values written in that number and text-field component.
Any suggestions would be helpful :)
Many thanks!
Hi everyone,
As there were no response so far, I just wanted to know if there's any workaround to the problem I have mentioned in my post. Any help would be appreciable.
Thanks!
Hi everyone,
As there were no response so far, I just wanted to know if there's any workaround to the problem I have mentioned in my post. Any help would be appreciable.
Thanks!
Hi @Anonymous,
A data-grid is like any other component, this means you can set the value of data-grid2 based on data-grid1 using the calculated value feature.
Add your two data-grids into your form/wizard. Ensure the two data-grids contain the same components with the same property name on the api tab.
Open the component settings for data-grid2 and navigate to the data tab. Here you can use the "Calculated Value" setting to set the value of data-grid2 to be value of data-grid1
Heres an example expression, however you will need to adapt this for your specific form.
value = data.dataGridRepeatingTable1
To keep things focused. I would suggest raising your second question as a seperate thread that way others don't get confused with multiple issues if they come across this issue :) I'll be happy to address that question there.
Hi Erin,
Thank you for the reply.
I was able to achieve the result with your method. But, it only displays the result for the first row from the first data grid component i have 2 or more rows, but on the second data grid component it only displays the first row from the first data grid component, and that too in an object format.
In this format=
{"OrderNumber":"ON-001"}
Hi @Anonymous
I can see what you mean by only the first row is displaying the results from the original data-grid. Upon investigation I can see what is happening is data-grid2 is not redrawing/refreshing to automatically add any additional rows. As a work around you can take a different approach.
Remove the calculated value you setup based on the previous response. This is to avoid any conflicting logic with the new approach I will be suggesting below
Open the component setting or data-grid1 and under the logic tab location the "On Change" setting and add the following JavaScript. This code will set the value of data-grid2 based on the value of data-grid1. Note you will need to adapt this code to match your specific form.
instance.root.getComponent('dataGrid2').setValue(data.dataGrid1)
Note data-grid2 must contain the same components (with the same property names in the api tab) otherwise you will experience issue like a field appearing in "object format" as you described.
Here is an example showing this working:
