View Issue Details

IDProjectCategoryView StatusLast Update
0022132mantisbtuipublic2020-08-09 19:20
Reportercproensa Assigned To 
PrioritynormalSeveritymajorReproducibilityhave not tried
Status acknowledgedResolutionopen 
Product Version2.0.0 
Summary0022132: Some tables gets off screen and cant be scrolled conveniently
Description

The same issue described by 0021817 affects view_all_bug_page, where if a number of columns are selected to be shown, the content of the issues list is partly hidden and cant be scrolled conveniently.
The horizontal scroll is located at the bottom of the table container, so a user has to:

  • scroll down the page to the end of table
  • scroll the table contents horizontally
  • scroll up the page back to the original rows to see the contents.
Tagsmodern-ui

Relationships

related to 0027114 closedcommunity Long unbreakable text does not auto wrap in bug details page 
has duplicate 0021817 new adm_config_report.php configuration table overflows screen and is not usable 
has duplicate 0021702 closedcproensa Horizontal scroll bar not shown 
related to 0021818 new Forms and tables are not fitted to viewport sizes, eg: mobile browsers 
related to 0023335 new "Update issue" layout can be too wide 
related to 0025166 new Debug log in screen is easily overflowed due to sql queries 

Activities

cproensa

cproensa

2017-03-27 19:42

developer   ~0056231

There are some js solutions. For example: https://github.com/Amphiluke/floating-scroll

I have this branch as a proof of concept:
https://github.com/cproensa/mantisbt/tree/test_floatingscroll

vboctor

vboctor

2017-03-27 20:21

manager   ~0056232

Last edited: 2017-03-27 20:32

As we use a library for the View Issues table, we should look for the following feature:

  • Good horizontal scrolling (what you are trying to fix here)
  • Works well for wide / narrow screens (i.e. responsive)
  • Ability to click on column titles for sorting.
  • Ability to drag columns to add/change order/delete columns.
  • Fetch data from the backend (via REST API) without a full page refresh of View Issues page.

The above is what I ideally would like to see for this control. How much of it is out of the box vs. something that we have to build on top of a control, I don't know. @syncguru may have better experience in this space to comment.

atrol

atrol

2017-03-28 04:40

developer   ~0056233

he content of the issues list is partly hidden and cant be scrolled conveniently.

A workaround is to use the left/right cursor keys.

cproensa

cproensa

2017-03-28 05:41

developer   ~0056234

As we use a library for the View Issues table, we should look for the following feature:
Good horizontal scrolling (what you are trying to fix here)
Works well for wide / narrow screens (i.e. responsive)
Ability to click on column titles for sorting.
Ability to drag columns to add/change order/delete columns.
Fetch data from the backend (via REST API) without a full page refresh of View Issues page.

What you are describing is something in the line of DataTables library (as an example)
The scrollball fix does not alter in any way how the table contents are built or behaves.

Note that the issue here does not relate to how the table is built or behaved.
It only describes the ability to scroll, in a convenient way, a table when it has overflowed-hidden over the parent container.

Since the new UI, table containers are lmited to maximum screen width, but contained data can be wider, this issue is relevant.
I consider it a major issue in usability. You may not have experienced if you don't use custom fields and/or relatively-low resolution displays.

This is susceptible to happen on any table div, so my suggestion atm is to implement this feature in all responsive-table divs.
As far as i have experienced, it affects especially to view-bugs and manage-configuration tables.

A workaround is to use the left/right cursor keys.

That's not a satisfactory UX solution. As a workaround may work, but i couldn't instruct the users to use that.

cproensa

cproensa

2017-04-14 14:52

developer   ~0056552

PR:
https://github.com/mantisbt/mantisbt/pull/1092

dregad

dregad

2020-08-09 19:20

developer   ~0064253

Maybe 0027114 will address this ?