Category: How do I do X?
Updated

This solution is summarized from an archived support forum post. This information may have changed. If you notice an error, please let us know in Discord.

Fix keyboard navigation order

Issue

I am having an issue with the keyboard navigation order on my AppSmith app. When I hit the tab key, the fields are jumping all over the screen instead of going in a logical order from left to right and top to bottom. I want to know how AppSmith determines the tab key focus and how I can change the order for my app. The current workaround is to redraw the app, but I am hoping for a better solution. Also, I will upvote the feature request to improve the form widget keyboard accessibility.

Resolution

The AppSmith platform currently doesn't have a logical tab key focus order for fields in an app. The focus order is determined by the order in which fields were added to the canvas. However, this feature improvement is on AppSmith's roadmap and can be upvoted on GitHub.

As a workaround, app builders can redraw their app and place fields on the canvas in the desired tab key focus order. This may be time-consuming but is currently the only solution available.

To improve keyboard accessibility, it is important to add keyboard shortcuts to your app, which allow users to access different parts of your application without having to use the mouse. These include using "tab" to navigate the different links, forms, and buttons, using "enter" to submit forms or trigger buttons, and using "escape" to cancel or close dialogs.