How to select the Rows in Flutter DataTable on loading?
The Flutter DataTable widget provides support to select the multiple rows programmatically on loading by setting DataGridController.selectedRows property. You can also select the single row by using the DataGridController.selectedRow or DataGridController.selectedIndex properties.
Create an instance of the DataGridController and set it to the controller property. To select the rows on loading, the collection of DataGridRow that you want to select should be added to the DataGridController.selectedRows property in initState method.
The following example shows how to select multiple rows on loading in DataGrid,
late EmployeeDataGridSource _employeeDataGridSource;
List<Employee> _employees = <Employee>[];
final DataGridController _dataGridController = DataGridController();
@override
void initState() {
super.initState();
_employees = getEmployeeData();
_employeeDataGridSource = EmployeeDataGridSource(employees: _employees);
_dataGridController.selectedRows = [
_employeeDataGridSource.dataGridRows[0],
_employeeDataGridSource.dataGridRows[2],
_employeeDataGridSource.dataGridRows[4]
];
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('SfDataGrid Demo')),
body: SfDataGrid(
source: _employeeDataGridSource,
controller: _dataGridController,
selectionMode: SelectionMode.multiple,
columns: [
GridColumn(
columnName: 'id',
label: Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerRight,
child: const Text(
'ID',
overflow: TextOverflow.ellipsis,
))),
GridColumn(
columnName: 'name',
label: Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerLeft,
child: const Text(
'Name',
overflow: TextOverflow.ellipsis,
))),
GridColumn(
columnName: 'designation',
label: Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerLeft,
child: const Text(
'Designation',
overflow: TextOverflow.ellipsis,
))),
GridColumn(
columnName: 'salary',
label: Container(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
alignment: Alignment.centerRight,
child: const Text(
'Salary',
overflow: TextOverflow.ellipsis,
)))
]));
}
Conclusion
I hope you enjoyed learning how to select the rows in Flutter DataTable on loading.
You can refer to our Flutter DataTable feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion®, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
