ADA Compliant

mujeera

Hi there,

How can I navigate through the rows using the tab? We are testing for the ADA compliance.

allan

I don't really understand what you mean by "navigate" as there are several options:

1. Using something like Select to select rows
2. KeyTable for cell highlighting
3. Using a screen reader, in which case you'd use whatever commands a screen reader needs to navigate an HTML table.

Allan

mujeera

I meant to say using the tab button to navigate. I ended up using the keys option to true. that worked superb. However in the search box if you type some thing which is not in the datatable and you click on the tab, it will generate an error "0x800a138f - JavaScript runtime error: Unable to get property 'column' of undefined or null reference". Please let me know about your thoughts.

mujeera

Here is my attempt to fix the issue. Basically I tried to change the value of keys to false if there is no record found. but this solution didn't work so great

$("[type='search']").on('keyup', function () {
    var info = $('#grdMaintainFAQs').DataTable().page.info();

        $('#grdMaintainFAQs').DataTable().destroy();
        $('#grdMaintainFAQs').DataTable({
            paging: false
        });
    if (info.recordsDisplay == 0)
    {

        $('#grdMaintainFAQs').DataTable().destroy();
        $('#grdMaintainFAQs').DataTable({
            keys: false
        });
    }
    else
    {

        $('#grdMaintainFAQs').DataTable().destroy();
        $('#grdMaintainFAQs').DataTable({
            keys: true
        });
    }
});

allan

Thanks for the extra details. I can reproduce that issue in this example.

1. Load the page
2. Search for "not here" in the DataTable search box
3. Press tab on the keyboard

Result: Javascript error.

That is a bug in KeyTable. I will fix that shortly and post back here when done.

Regards,
Allan

allan

Fixed here. The nightly build will be up-to-date with this change in about 10 minutes time.

Thanks for letting me know about that problem!

Regards,
Allan