0

I'm trying to figure what the best was to handle large text fields in the middle of a form.(Ex. Comments) Is scrolling box the best way, or clicking a "view more" button at the end with the ability o view less. If we go with the View more/ view less option, is it okay to have editing the comments in a scroll and on read only have view more?

Thanks in advance for the help.

1

One size does not fit all

There are two primary ways to solve this. I do not believe sub-scrolling (scrolling comments within a larger scrolling view) is one of them. You have to evaluate the pros and cons against the application, then test the users before you can declare the "winner".

Option 1: Expand on demand

Pinterest "load more" control

Pros

  • It provides a manageable sized preview of the content with the ability to vary the amount expanded on interaction.

  • Clearly indicates that there is more content available.

  • Keeps the user within the primary view.

Cons

  • When a user gets carried away, they can end up with an unwieldy amount of content.

  • Coming back to a page, it can be a challenge to find a comment that falls behind the expand control ("permalinks" for comments can solve this).

  • Does not (usually) provide any indication of how much content is remaining.

Option 2: Pagination

Amazon pagination controls

Pros

  • Isolates the page from the effects of lengthy comment threads.

  • Provides a clear view of the amount of content available.

  • Provides a convenient way to jump through long threads.

  • Keeps the user in the current view without distorting it.

Cons

  • More UI clutter: next / previous controls, page count, current page, and optionally a comments per page control.

  • You'll need to show more comments initially since each "page" should have the same count and users don't want those to be too short.

Changing controls based on mode

I'm not sure what you mean by "editing the comments". Are you referring to a user going back to edit their own comment? If so, I see no reason to change the control in that scenario. I would either allow them to edit directly in place once they've gotten to their comment (turn it into a text field) or pop the comment as a modal.

  • The question is for text fields in the middle of a form. Pagination in a field? Your answer seems to be for a page. – Madalina Taina Oct 18 '16 at 11:25
0

It depends in part on how often the field is needed by the user. If the field is usually empty or has minimal information (maybe 2 or 3 lines), then a "view more" approach is appropriate. But if the field often has 8+ lines of text, a scrollbar will be better. You can also have a special condition to limit the maximum size of the textbox, so the "view more" link can create a scrollbar if the text is 20+ lines, because you probably do not want that text to fill the entire screen if someone types their life story into it.

For editing, I suggest that the box has a scrollbar. If you want to make it more advanced, the box can expand dynamically as needed, and a scrollbar is added when the text approaches a set size limit. As an aside, I suggest that you set a large inner-right margin on the text, so that the sudden addition of the scrollbar does not reformat the text.

The goal is to reduce any wasted space on the page, so there is no reason to have a large field for a small amount of text. And if there is a large amount of text, you probably don't want it to dominate the page.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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