search

DataTables / Responsive

Responsive extension for DataTables, providing support for complex tables on all device screen sizes
Other
148 stars 87 forks source link

Making collapsable content accessible via tabindex and keyboard #38

Closed MuellerMatthew closed 9 years ago

MuellerMatthew commented 9 years ago

Adding a tabindex to each row, and then adding an event handler to capture the enter key on each row, and then generate a click event to make the responsive datatable accessible. This is in response to #37 and is a fix I implemented in my own code to make it accessible for users.

DataTables commented 9 years ago

Thanks for this - it probably isn't something I'm going to pull in at the moment, as I'm not keen on a blanket tabindex for all rows (it also isn't appropriate in all use cases of Responsive where you can have a specific element controlling the show / hide).

One point the event listener $('tr')... is selecting all rows on the page, including in the table header and footer, and all rows outside of the DataTable. It also won't cope with any rows that are added after that code is run (for example on a different page). A delegated event listener on the table body rows would probably cover it better.

Having said that, I very much do want to add accessibility properly to Responsive as we've discussed before. v1.1 should do that. I will leave this open until then.

MuellerMatthew commented 9 years ago

Yeah, It is a sloppy hack, and I wasn't expecting it to be merged, but I figured I would still share it so that if anyone has ideas on how to improve it, it or if anyone else needs a temporary fix to make their product accessible they can jump off from here.