Hello,
Is there a process to write data in a SfDataGrid in Columns of data rather than Rows?
Here's an example of how my sfDataGrid displays data now:
First Name | Last Name | Title | Salary |
John | Smith | Director | $100K |
Susan | Murray | CEO | $500K |
Because I have many columns of data and wish to avoid side-scrolling, I'd like to place the data in this format but I'm unsure how to approach this:
John | Smith |
---|---|
Title | Director |
Salary | $100K |
Susan | Murray |
---|---|
Title | CEO |
Salary | $500K |
Hi Martin,
Currently, DataGrid doesn’t have support for that mentioned format. By default, we map DataGrid row cell content based on the column and row. You need to do it from the sample level from your end by converting the source to required format. You need to give the same no of column and row cell counts. We have prepared a simple sample for that. In that sample, we have converted the source according to your format. Please check the following sample and code snippet.
class EmployeeDataSource extends DataGridSource { /// Creates the employee data source class with required details. EmployeeDataSource({required List<Employee> employeeData}) { for (Employee data in employeeData) { int index = 0;
List employee = [ 'ID', data.id, 'Name', data.name, 'Designation', data.designation, 'Salary', data.salary ]; for (int i = 0; i <= (employee.length - 1) / 2; i++) { DataGridRow dataGridRow = DataGridRow(cells: <DataGridCell>[ DataGridCell<String>(columnName: 'Header', value: employee[index]), DataGridCell<String>( columnName: 'Details', value: employee[index + 1].toString()), ]);
datagridRows.add(dataGridRow); index = index + 2; } } }
…
}
List<Employee> _getEmployeeData() { return <Employee>[ Employee(10001, 'Lara', 'Project Lead', 80000), Employee(10002, 'James', 'Developer', 23000), Employee(10003, 'Kathryn', 'Developer', 43500), Employee(10004, 'Michael', 'UI Designer', 50000), Employee(10005, 'Martin', 'Developer', 25000), ]; } |
Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/sample-1638883617
We hope this helps. In case we misunderstood your requirement, please provide more specific or clear use case details. It will be helpful for us to check and provide an appropriate solution.
Regards,
Tamilarasan
Thank you Tamilarasan,
Initial testing seems to have worked with the adjusted code - you've been a huge help and I'm very grateful for your assistance!
Have a great rest of the week!
Martin
Hi Martin,
We are glad that the provided response meets your requirement. If you are satisfied with our response, please mark it as an answer. Also, please let us know if you have any further queries on this. We are happy to help you.
Regards,
Tamilarasan