Use Links in a Grid to Show More Details and Edit Data
See SAIL Recipes for information about how to work through recipes and adapt them to your application.
Allow end users to click a link in a read-only paging grid to view the details for the row, and make changes to the data.
The data available for editing may include more fields than are displayed in the grid.
Note: This design pattern is not recommended for offline interfaces because displaying more data based on user interaction requires a connection to the server.
To achieve this goal, we use a!dynamicLink to store the selected employee data into a variable, and then allow editable text fields to update the individual fields of the employee. Finally, we associate a saveInto with the submit button to update the array of employees that populates the grid with the updated employee.
Test it out
Click on an employee's name in the grid's left column.
Change the employee's details and click the "Update" button.