Hi,
I've been trying unsuccessfully at trying to get the datalist to show records from the selected row of the datagrid. I'm not sure what I'm missing, I've tried several methods.
Basically the datagrid is the list of Users and there are many columns so on the left of the page I only show a few of these. On the right side of the page I have a datalist that should show the selected record. Using a datalist so I can template the data, but a Card would be fine if that's easier.
I've found a few master/details posts on here but they did not work for this situation. Can you explain how to do this or link me to a post that shows how?
Invoke the data source method in the RowSelect method and assign a property for the result.
Set the data property of the datalist to the result property in the previous step.
Design the template with a bunch of labels, icons, etc. (just get creative here, play with the css as well to achieve a better user interface). Remember to use ${data.Property} in the labels.
Whenever the user clicks a row in the datagrid, the details will show elegantly in the datalist.
Thanks, I got it now.
I had the RowSelect of the DataGrid all assigned and the DataList Data property all good.
The Text property of the Label in the datalist template was my issue and not showing anything.
As you mentioned use the {data.Property} which is what I was using but getting the result.
Selecting the Template property>record gets you the ${data.property}
As it turns out it works when you use the Page properties instead.
Selecting the Page properties>record gets you ${getByIDResult.Property} and now I see the property result.
It took awhile to resolve this but thanks for your reply, it confirmed that most of what I was doing was correct.
Next step is to have the first row of the datagrid selected by default so the datalist has data to show without needed to have the row selected. Have you had any success doing this? I was thinking it would be done in the Events > LoadData because I don't see a Default value in the list of datagrid properties.
Using the Value property of the DataGrid with ${getResult[0]} selects the row but did not cause the datalist to show the first recordset.
However the LoadData event of the DataGrid is where I needed to add a Handler with the property of Execute Code. This worked: this.grid0RowSelect(this.getResult[0]);
Yes, to select the first row of the data grid by default you can execute code after setting the result property in the LoadData event; this.grid0.onSelect(result.value[${index}]).
And you can set a condition to test if the datagrid has a value; result.value.length && !this.grid0.value.
I see your problem now. You are using the getByID method which results in an array with the contents of a specific row not an array of objects, so de ${data} property is not valid.
If you are displaying the exact same info as the LoadData method, I believe there's no point in calling the getByID method everytime in the RowSelect event, it's a waste of resources.
And I also believe that there's no point in showing this data in a datalist because it is not an array of objects, you're getting just one result (specific row data).
Just set a card with a bunch of labels: in the RowSelect event, set a property, for example, rowData to ${event} which contains all the row data. And set the label Text property to ${rowData.Property}.
So everytime you click a row it won't call a getById method, instead it will just send the information of the row back to a label.
And instead of a combination of a datagrid and a bunch of labels you can just use a datalist (holding an array of objects).