For Ag grid table using row grouping feature and setting the hide : true for grouped column then the aria column index is not set sequential for visible column. Even the hidden column index is counted.
This is causing accessibility issue.
columnDefs = [
{
headerName: "Qualification",
field: "Qualification",
rowGroup: true,
hide: true,
},
{
headerName: "Name",
field: "Name",
},
{
headerName: "DOB",
field: "DateOfBirth",
},
{
headerName: "Location",
field: "Location",
},
]
const rowData = [
{
"Name": "Akshay Patil",
"DOB": "13-11-1980",
"Qualification": "B.Tech",
"Location": "Noida",
},
{
"Name": "Mahesh Vaidhya",
"DOB": "13-11-1987",
"Qualification": "B.Tech",
"Location": "Mumbai",
},
{
"Name": "Sabitri Pal",
"DOB": "13-11-1990",
"Qualification": "BSc",
"Location": "Mumbai",
},
{
"Name": "Karina Rao",
"DOB": "13-11-1997",
"Qualification": "BCom",
"Location": "Noida",
},
]
< AgGridReact
headerHeight = { 47}
rowHeight = { 56}
domLayout = "autoHeight"
defaultColDef = {{
flex: 1,
}}
rowData = { rowData }
columnDefs = { columnDefs }
groupDisplayType = "multipleColumns"
/>
Output :
AG Grid Output Column Index
Expected :
AG Grid Expected Column Index
New contributor
Manish D is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.