0

I have a table to display certain entries,that table includes pagination as shown below:

enter image description here

I could think of two approaches to show the validation/error message:

  • Highlight the box if the user enters an invalid entry in the goto page box.
  • Disable the Go button unless the input type has a valid page number.

Which can be the best approach from a UX perspective?

Improve this question

4 Answers 4

Reset to default
3

Did you consider using other ways to select a page number?

One of the challenges of allowing a person to type into a field is they may not even type a number, so you will need to consider all sorts of other types of data entry field validation.

If you use an alternate way for selecting the page, which doesn't involve typing, then the person cannot enter incorrect characters, thus also simplifying the work for the developer and QA. However you would still have the conundrum of what to do with the Go button.

One alternative approach is to redesign the pagination. Consider this approach where you have a drop-down field and simple page forward and back buttons:

enter image description here

Because the user can see how many pages there are (1 of 6), they can simply press the Next button the number of times it takes to get to the page they want.

If you click the Page 1 of 6 drop-down you can display the following to help the user reach their intended page. Here I am display the Jump to page number (which defaults to the next page in the sequence) and the user simply toggles the page number up and down controls to change the number:

enter image description here

You can also see in this example, I am also allowing the user to choose how many items to display per pagination page, but I only included this as something else to think about.

Improve this answer
6
  • Hey,thanks for the suggestions.In this approach the person can write any character in the jump to page button and how do you envision error handling if I type an invalid page number?
    – Nirav Chadda
    Jun 22, 2016 at 9:47
  • That design is from one of the products I design for and you cannot type in the Jump to page number field - you can only move the number up or down. We did consider allowing typing the number but decided against it because we did not want to handle error validation and wanted to keep this simple. My Developers could enforce guardrails using JS to ensure you could not type an incorrect thing, but this would complicate dev and QA.
    – SteveD
    Jun 22, 2016 at 10:01
  • 1
    Our usability testing and analytics showed that most people don't use this Jump to page feature because it is much easier to use the main Next /Previous buttons to skip to where they need to go. Our data showed that the reason for this is the user does not know what would be on page for 4 (for example), so they would rather cycle though the pages in sequence until they eventually find what they where looking for.
    – SteveD
    Jun 22, 2016 at 10:06
  • That makes sense but still I can envision 50k records in my table and hence total page count would be huge,so If a person wants to jump 10 pages(we have column based sorting in place so some rough idea would be there about what a person is looking for),he/she would have to hit the increment button 10 times inside the jump to page...
    – Nirav Chadda
    Jun 22, 2016 at 10:23
  • 1
    Without knowing the user's goal in your situation it will be difficult to answer your question. User's goals rarely involve wading through 50k records, typically their goal is to either find just 1, or to compare a couple of records, and there are better design approaches to meet these user goals that will be better than paginating through large record sets.
    – SteveD
    Jun 22, 2016 at 10:33
1

One thing that is missing and you should have is - information on total number of pages available. In your screen shot user does not know how many pages there are when the grid loads. Knowing that information is good but you still need validation. I suggest an alternate solution.

enter image description here

I think this is simpler UI , no explicit go to buttons , it keeps controls to minimum number, you still have arrows to go across (next/previous) pages while keeping the ability to go straight to any page if user wishes(key in number and enter or tab out). And user knows there are 20 pages. You can do red border validation or tool tip etc as you like.I guess with this approach not showing any validation message is also okay ..

Improve this answer
1
  • Hey thanks for the suggestion,I will try to incorporate total number of pages in my approach,but still in your case if I type an invalid character/page number,how would you handle that?
    – Nirav Chadda
    Jun 22, 2016 at 9:50
0

You can either leave the Go button enabled or disabled. But, disabling it without providing the reason might confuse the user which may ask himself "why is this disabled?".

Your suggestion to highlight the box and providing the tool-tip is a common and good solution to validation of the page number.

Improve this answer
0

I think both approaches are correct as long as the users knows the number of pages S/he can navigate to. Something like this... enter image description here

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.