Tag Archives: AngularJS

Making clickable table rows accessable

This particular issue came up for me at work.  The project in question uses AngularJS and bootstrap.  We had a table where the rows were already clickable and opened up a modal popup (id = #recordModal) to edit the record.  However, it was not accessible via the keyboard.

<table class="zebra record-list" cg-busy="'tracker'">
    <tr ng-repeat="record in list
            data-toggle="modal" data-target="#record-modal"
        <td>{{ record.field1 }}</td>
        <td>{{ record.fieldN }}</td>

Continue reading