Not able to Navigate Pagination thru Tab Key

580

Yogesh Shah posted over 10 years ago

Hi,

I am using the WDG in one of my application. Application demand the navigation thru tab key.

Surprisingly when focus is on grid and user press the ‘Tab’ key, focus navigate to the scrollbar, if it is available and again the user press the ‘Tab’ key, focus navigate to the another control. It is not going to the Pagination panel.

I am using the default pagination property in my application.

Can anyone help me, how we can stop/navigate the pagination panel thru ‘Tab’ key?

Thanks & Regards,

Yogesh Shah

20255

Offline Zdravko Kolev posted over 10 years ago in reply to Yogesh Shah
Hello,

I have found article that demonstrates how to implement a WebDataGrid custom pager with the following feautures:

First, previous, next and last buttons

Direct access to individual pages

Display of current page number

Display of total record count

Manipulation of page size

I hope you will find it helpful

http://es.infragistics.com/community/groups/aspnet/wiki/learn-to-build-a-webdatagrid-custom-pager.aspx
Cancel
Reply

Cancel
580

Yogesh Shah posted over 10 years ago in reply to Zdravko Kolev

Thanks for your replay.

As of now, we are not in position to use Custom Paging Template as it will impacting in our entire application.

We want to make our application compatible with another third party tool and that tools understood only 'Tab' key. In our standard pagination we have only 'Span' tag, instead of 'A HREF' tag, so 'Tab' key does not navigate there.

I am still working on this issue.

Thanks,

Yogesh Shah
Cancel
Reply

Cancel
20255

Offline Zdravko Kolev posted over 10 years ago in reply to Yogesh Shah

Hello Yogesh,

I'm just checking if there is anything that I could help you with.
Cancel
Reply

Cancel
20255

Offline Zdravko Kolev posted over 10 years ago in reply to Yogesh Shah

Hello,

You could get the pagination panel with jQuery selector. There is unique css clas ".igg_Pager", and after you get the pager element you can get its child's. See the code snipped:

function KeyDown(sender, eventArgs) {
            var keyCode = eventArgs.get_browserEvent().keyCode;
            if (keyCode == 9) {

                var pagingBehavior = sender.get_behaviors().get_paging();
                if (pagingBehavior.get_pageIndex() == pagingBehavior.get_pageCount() - 1) {
                    $($("div.igg_Pager").children()[0]).focus();
                } else {
                    $($("div.igg_Pager").children()[(pagingBehavior.get_pageIndex() + 1)]).focus();
                }

                eventArgs.set_cancel(true);
            }
        }

Although my suggestion is to use Custom Pager Template, and when you create this template you can access its custom buttons (Next and Prevs and so on) and focus on them. See the reference that is demonstrating how to configure custom pager appearance using the pager's template.

Useful reference:

Using Custom Paging Template

Looking forward to hearing from you!
Cancel
Reply

Cancel
580

Yogesh Shah posted over 10 years ago in reply to Zdravko Kolev

Thanks for your replay.

We wants to have cursor focus on the pagination panel and all the page numbers one by one when user press the tab key. We do not want to navigate to the another page while pressing the tab.

Thanks

Yogesh Shah
Cancel
Reply

Cancel