Hi,
I'm working with a client that is currently stuck using 8.0.12 because in 8.1.16 it seems that tabbing between fields within different containers does not work the same way. This has caused me to go down a rabbit hole of testing to be able to writeup this post.
To simplify the setup, the view is setup such that the root is a flex container, then inside there are two flex containers (value1Ctn, value2Ctn). Inside each of those containers there is a Label component named Label and either a Dropdown, Numeric Entry, or Text Field component named Value. Attached is a zip file with a view I setup for testing that has this format:
TestTabbing.zip (8.8 KB)
In 8.0.12, the user can enter information into value1Ctn/Value, then when they press tab, it goes over to value2Ctn/Value for them to enter more information in. Then can then press Shift+Tab to go backwards through the fields. This seems to be true for any of the three component types in the view.
In 8.1.16, with the Restored Gateway Backup from 8.0.12, the user can enter information into value1Ctn/Value, but when Tab is pressed, it seems to not select anything (although my suspicion is that it's selecting the Label within the same container), then pressing tab again highlights value1Ctn/Value again. It does not seem to be able to go to value2Ctn/Value. This seems to occur regardless of the component type used. The user seems to be able to use Shift+Tab to go in the reverse order through the fields, until the component is a Dropdown. Then it gets stuck even with Shift+Tab. The view behaves the same way (entering information and saving it to a table in the database) as the 8.0.12 project, just without the Tab key working as expected.
My results when building a view like this from scratch within 8.1.16 are below.
-
From a Dropdown component:
-- If selecting an option, using the Arrow Keys and Enter to confirm, or Left Clicking an option with the mouse, the field loses focus and focus seems to be gained by the browser (tested using Google Chrome). This is unexpected because now the user cannot use the Tab key to go to the next field, as the focus is somewhere on the browser itself. This is not the same as observed in 8.0.12.
-- If selecting the Dropdown field but not selecting an Option and pressing Tab, it goes to the next field as observed in 8.0.12.
-- If selecting the Dropdown field but not selecting an Option, then pressing Shift+Tab, it does not go back to the previous field. This is not the same as observed in 8.0.12.
-- Summary: It loses focus when selecting an option, forward tabbing does seem to work as observed in 8.0.12, but reverse tabbing through it does not seem to work as observed in 8.0.12. -
From a Text Field:
-- Entering information then pressing Enter does not lose focus as observed in 8.0.12.
-- Entering information then pressing Tab goes to the next field as observed in 8.0.12.
-- Entering information then pressing Shift+Tab goes to the previous field as observed in 8.0.12.
-- Summary: It seems to perform as observed in 8.0.12. -
From a Numeric Entry Field:
-- Entering information then pressing Enter seems to lose focus, but it seems to remain in the container because pressing tab afterward highlights the Numeric Entry Field again. This is not as observed in 8.0.12.
-- Entering information the pressing Tab seems to lose focus, but seems to remain in the container because pressing tab afterward highlights the Numeric Entry Field again. Does not go to the next field as observed in 8.0.12.
-- Entering information the pressing Shift+Tab goes to the previous field as observed in 8.0.12.
-- Summary: Forward tabbing does not seem to work as observed in 8.0.12, but reverse tab does seem to work as observed in 8.0.12.
I have also tried this same test view with a brand new project in 8.0.17 with the test View as the only View with slightly more similar results to 8.0.12:
-
From a Dropdown component:
-- If selecting an option, using the Arrow Keys and Enter to confirm, or Left Clicking an option with the mouse, the field loses focus and focus seems to be gained by the browser (tested using Google Chrome). This is unexpected because now the user cannot use the Tab key to go to the next field, as the focus is somewhere on the browser itself. This is not the same as observed in 8.0.12.
-- If selecting the Dropdown field but not selecting an Option and pressing Tab, it goes to the next field as observed in 8.0.12.
-- If selecting the Dropdown field but not selecting an Option, then pressing Shift+Tab, it does not go back to the previous field. This is not the same as observed in 8.0.12.
-- Summary: It loses focus when selecting an option, forward tabbing does seem to work as observed in 8.0.12, but reverse tabbing through it does not seem to work as observed in 8.0.12. -
From a Text Field:
-- Entering information then pressing Enter does not lose focus as observed in 8.0.12.
-- Entering information then pressing Tab goes to the next field as observed in 8.0.12.
-- Entering information then pressing Shift+Tab goes to the previous field as observed in 8.0.12.
-- Summary: It seems to perform as observed in 8.0.12. -
From a Numeric Entry Field:
-- Entering information then pressing Enter does lose focus as observed in 8.0.12.
-- Entering information then pressing Tab goes to the next field as observed in 8.0.12.
-- Entering information then pressing Shift+Tab goes to the previous field as observed in 8.0.12.
-- Summary: It seems to perform as observed in 8.0.12.
I believe we were stuck at 8.0.12 initially because the Dropdown component itself changed in version 8.0.13 with the behaviors listed above which breaks usability for our client.
As the view is meant to be a Data Entry styled view, we are unable to upgrade to the newer versions of Ignition because this is a must have functionality for them. This style of view is also utilized in many other views throughout the project, so refactoring every view would require a lot of work and I don't think is something that is feasible.
We want to upgrade Ignition because it has some new features that we could see utilizing in the project and for the gateway stats as well for debugging and such.
Not sure if this is the correct place to post this, but any help would be appreciated!
Thank you,
Jake