Only enable next button when user scrolls to the bottom of the page

[KhumboLihonga]

Is your feature request related to a problem? Please describe.
Sometimes there is a display item that is enabled at the bottom of the page that a user needs to see before they proceed to the next page.

Describe the solution you'd like
The next button can be disabled by default and only enabled once the user scrolls all the way to the bottom of the page.

Describe alternatives you've considered
I can't think of anything else that prompts the user to scroll to view more information. If there is something, please let me know.

Additional context
As shown in the video below, the user can proceed to the next page without seeing the prompt "viral load collection is due today"
https://user-images.githubusercontent.com/90775548/207011675-8d3da458-2bf4-48ca-9198-92296f000bf6.mp4

Would you like to work on the issue?
N/A

[santosh-pingle]

@shelaghm @jingtang10
If entry mode has prior-edit code, then Next button is only enabled if required questions are answered.
I am not sure whether progress bar which is shown at the top in the paginated layout can solve the problem.

I am not seeing vertical scrollbar on the page in the attached video, if it is invisible after sometime once scroll event is done, then we can think of showing vertical scroll bar all the time that can tell the user there is more information at the bottom.

[KhumboLihonga]

@santosh-pingle thanks for responding to this so quickly. The entry mode is set to prior-edit but the item that is enabled is a display item and so it shouldn't block the user from proceeding to the next page.

The progress bar is great but when you have multiple pages, it works according to the number of pages not how far the user has scrolled down on the active page.

The vertical scrollbar is a good option, it just has to be visible enough I guess. This issue is just a suggestion, any other options are welcome.

[omarismail94]

@shelaghm Can you give an update on this?

[shelaghm]

Hi @KhumboLihonga,

Let me know if I summarized the problem correctly?
The primary issue is that users are not scrolling to the bottom to see all the questions and might prematurely click "next" before completing all the questions.

Brainstorming some solutions to address this problem.

1. (as Khumbo proposed) Next button can be disabled by default and only enabled once the user scrolls all the way to the bottom of the page.
2. (as Santosh proposed) Add a vertical scrollbar that shows progress within one page on a paginated questionnaire. I think the challenge is that it only appears while you're actively scrolling and then disappears. We can maybe look into this a bit more?
3. Automatically adjusting the focus, so when a new question is added the screen auto scrolls up so the new question is visible.
4. Modify the way the questions are displayed, so that they are not hidden below the fold. Since you're using the paginated layout in our design guidelines we recommend limiting what's displayed on each page so it's not hidden behind the fold. Is this an option for you?
5. Modifying the questionnaire so that it is displayed as default/long scroll. I think in the current implementation the bottom button is still always visible, but we could change this so that it is anchored on the bottom of the questionnaire and only visible when the user has scrolled to the bottom.

• My immediate recommendation would be to see if option 4 or 5 could work for you @KhumboLihonga?
• My concern with option 1 is hiding/disabling buttons can also lead to user confusion, and I have a preference for keeping paginated navigation buttons anchored and always visible. We have some design guidelines here with the rationale
• I'm not sure option 2 is going to make much of a difference in making content more discoverable, but can look into it.

[KhumboLihonga]

Hey @shelaghm, you have summed up the problem really well thank you. After discussing with our team, option 5 sounds like the best option.

[shelaghm]

@KhumboLihonga Great to hear, let us know if you have any other feedback or suggestions as you work on modifying the questionnaire to be long scroll.

[KhumboLihonga]

@shelaghm will do. However, I'm not the one assigned to this issue. @omarismail94 do we have anyone looking into this?

[KhumboLihonga]

@omarismail94 just following up, is there anyone looking into this?

[f-odhiambo]

@jingtang10 Kindly assign Lazarus github.com/lzrs