ICEfaces
  1. ICEfaces
  2. ICE-9408

Support Page Up Page Down Keyboard Pagination in ace:dataTable

    Details

    • Type: Improvement Improvement
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: None
    • Fix Version/s: 4.0.BETA, EE-3.3.0.GA_P02, 4.0
    • Component/s: ACE-Components
    • Labels:
      None
    • Environment:
      Tomcat 7
    • Assignee Priority:
      P1
    • Salesforce Case Reference:
    • Affects:
      Documentation (User Guide, Ref. Guide, etc.), Sample App./Tutorial

      Description

      There may have been pagination through the ice:dataTable with the page up, page down keyboard buttons.

      This enhancement has been requested by a client for the ace:dataTable.

        Activity

        Hide
        Brad Kroeger added a comment -

        Assigning to Nils as per Ken's request.

        Show
        Brad Kroeger added a comment - Assigning to Nils as per Ken's request.
        Hide
        Mircea Toma added a comment -

        Added callbacks for page up/down keys that change the page index and submit paginator's state back to the server. Also, when the paginator is re-created the previously registered callbacks are removed to avoid generating memory leaks.

        Show
        Mircea Toma added a comment - Added callbacks for page up/down keys that change the page index and submit paginator's state back to the server. Also, when the paginator is re-created the previously registered callbacks are removed to avoid generating memory leaks.
        Hide
        Ken Fyten added a comment -

        It would be better if the PgUp/PgDwn keys only activated the paginator buttons when the focus was somewhere within the ace:dataTable or paginator itself. The default PgUp/PgDwn behaviour is to scroll the viewport page in the browser, and we would want to preserve that when not focussed inside a dataTable. Also, this would allow the PgUp/PgDwn keys to work with multiple dataTables on the page.

        The ice:paginator worked this way, here is a quote from the TLD doc:

        Note: Shortcut keys would only be processed when focus is on one of a paginator button or focus is on one of a row in the datatable when keyboardNavigationEnabled is true on rowSelector as well.

        Show
        Ken Fyten added a comment - It would be better if the PgUp/PgDwn keys only activated the paginator buttons when the focus was somewhere within the ace:dataTable or paginator itself. The default PgUp/PgDwn behaviour is to scroll the viewport page in the browser, and we would want to preserve that when not focussed inside a dataTable. Also, this would allow the PgUp/PgDwn keys to work with multiple dataTables on the page. The ice:paginator worked this way, here is a quote from the TLD doc: Note: Shortcut keys would only be processed when focus is on one of a paginator button or focus is on one of a row in the datatable when keyboardNavigationEnabled is true on rowSelector as well.
        Hide
        Mircea Toma added a comment -

        Activate PgUp/PgDwn keys only when the focus is somewhere within the ace:dataTable or paginator itself.

        Show
        Mircea Toma added a comment - Activate PgUp/PgDwn keys only when the focus is somewhere within the ace:dataTable or paginator itself.
        Hide
        Ken Fyten added a comment -

        Re-open to see if we can make the paginator buttons themselves focusable so you could tab through them. Alternatively, clicking on a paginator button and using the arrow keys to navigate through them would be fine also.

        Noticed that when I click on a dataTable body/row (that has no editable components), and then use pgUp/pgDwn it works once, but focus is lost/moved outside the dataTable. Is there anyway to keep focus inside that dataTable in this case so subsequent PgDwn/PgUp presses will work?

        Should also add Home/End support to go to the first/last page.

        Finally, need to test this in combination with a scrollable dataTable. In this case, the PgUp/PgDwn and Home/End keys should affect the scroll position, not the paginator pages.

        Show
        Ken Fyten added a comment - Re-open to see if we can make the paginator buttons themselves focusable so you could tab through them. Alternatively, clicking on a paginator button and using the arrow keys to navigate through them would be fine also. Noticed that when I click on a dataTable body/row (that has no editable components), and then use pgUp/pgDwn it works once, but focus is lost/moved outside the dataTable. Is there anyway to keep focus inside that dataTable in this case so subsequent PgDwn/PgUp presses will work? Should also add Home/End support to go to the first/last page. Finally, need to test this in combination with a scrollable dataTable. In this case, the PgUp/PgDwn and Home/End keys should affect the scroll position, not the paginator pages.
        Hide
        Mircea Toma added a comment -

        Modified paginator to respond to page up/down, arrow left/right and home/end keys. Also the focus is kept on the current page button when used to be able to repeatedly use the keys for pagination.

        Show
        Mircea Toma added a comment - Modified paginator to respond to page up/down, arrow left/right and home/end keys. Also the focus is kept on the current page button when used to be able to repeatedly use the keys for pagination.
        Hide
        Mircea Toma added a comment -

        The scrollable table already works as described above.

        Show
        Mircea Toma added a comment - The scrollable table already works as described above.
        Hide
        Carmen Cristurean added a comment -

        Testing with EE-maintenance branch rev# 40432 (all browsers):
        None of the keys (Page Up/Down, Home/End, arrow keys) appear to work when giving focus to the paginator.This is not an issue on IF4 trunk# 40432.
        When clicking inside the ace:dataTable, only the Page Up/Down work (only once, then focus is lost, which is a known issue); all the other keys don't change the paginator pages. This is not an issue on IF4 trunk# 40432.
        These issues can be reproduced with showcase > dataTable > Overview, or any other demos using pagination.

        Show
        Carmen Cristurean added a comment - Testing with EE-maintenance branch rev# 40432 (all browsers): None of the keys (Page Up/Down, Home/End, arrow keys) appear to work when giving focus to the paginator.This is not an issue on IF4 trunk# 40432. When clicking inside the ace:dataTable, only the Page Up/Down work (only once, then focus is lost, which is a known issue); all the other keys don't change the paginator pages. This is not an issue on IF4 trunk# 40432. These issues can be reproduced with showcase > dataTable > Overview, or any other demos using pagination.
        Hide
        Mircea Toma added a comment -

        Back-ported all changes from trunk.

        Show
        Mircea Toma added a comment - Back-ported all changes from trunk.
        Hide
        Carmen Cristurean added a comment -

        Testing with EE-3.3.0-maintenance branch# 40474 in FF27, IE10, Chrome33 using showcase > ace:dataTable demos - confirmed all above issues to be resolved.

        Show
        Carmen Cristurean added a comment - Testing with EE-3.3.0-maintenance branch# 40474 in FF27, IE10, Chrome33 using showcase > ace:dataTable demos - confirmed all above issues to be resolved.
        Hide
        Carmen Cristurean added a comment - - edited

        Testing fails (EE-3.3.0-maintenance-branch/ IF4 trunk# 40474) with the ace:dataTable test application > any of the Pagination tests:
        None of the keys are functional when clicking on the paginator (all keys work only when giving focus anywhere in the ace:dataTable). I am wondering if there is something missing in our test application that is causing the issue?

        DataTable application for EE-3.3.0-maintenance can be found here:
        http://dev.icesoft.com/svn/repo/qa/trunk/Regression-Icefaces2/Sparkle/Nightly/dataTable
        Pagination test demo: http://localhost:8080/dataTable/views/paginationTest.jsf

        Show
        Carmen Cristurean added a comment - - edited Testing fails (EE-3.3.0-maintenance-branch/ IF4 trunk# 40474) with the ace:dataTable test application > any of the Pagination tests: None of the keys are functional when clicking on the paginator (all keys work only when giving focus anywhere in the ace:dataTable). I am wondering if there is something missing in our test application that is causing the issue? DataTable application for EE-3.3.0-maintenance can be found here: http://dev.icesoft.com/svn/repo/qa/trunk/Regression-Icefaces2/Sparkle/Nightly/dataTable Pagination test demo: http://localhost:8080/dataTable/views/paginationTest.jsf
        Hide
        Mircea Toma added a comment -

        The focus retention is failing to re-apply the focus on the current page button. Because of this the keystrokes are not captured anymore by the paginator's container element.

        Show
        Mircea Toma added a comment - The focus retention is failing to re-apply the focus on the current page button. Because of this the keystrokes are not captured anymore by the paginator's container element.
        Hide
        Mircea Toma added a comment -

        Modified REGEX pattern in FocusController to consider IDs that do not contain the ':' separator valid.

        Show
        Mircea Toma added a comment - Modified REGEX pattern in FocusController to consider IDs that do not contain the ':' separator valid.
        Hide
        Carmen Cristurean added a comment - - edited

        All keys are functional now in ace:dataTable test application.
        Tested with EE-3.3.0-maintenance branch/ IF4 trunk rev# 40489 in FF27, Chrome33, IE10.

        Added regression test to ace:dataTable: http://server.ice:8888/svn/repo/qa/trunk/Regression-Icefaces2/Sparkle/Nightly/dataTable

        Added automation to new test case (selenium1 & webdriver).

        Show
        Carmen Cristurean added a comment - - edited All keys are functional now in ace:dataTable test application. Tested with EE-3.3.0-maintenance branch/ IF4 trunk rev# 40489 in FF27, Chrome33, IE10. Added regression test to ace:dataTable: http://server.ice:8888/svn/repo/qa/trunk/Regression-Icefaces2/Sparkle/Nightly/dataTable Added automation to new test case (selenium1 & webdriver).

          People

          • Assignee:
            Mircea Toma
            Reporter:
            Brad Kroeger
          • Votes:
            0 Vote for this issue
            Watchers:
            5 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: