View Issue Details

IDProjectCategoryView StatusLast Update
0022132mantisbtuipublic2017-09-11 07:51
ReportercproensaAssigned Tocproensa 
PrioritynormalSeveritymajorReproducibilityhave not tried
Status assignedResolutionopen 
Product Version2.0.0 
Target VersionFixed in Version 
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

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 

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

View 2 revisions

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

Issue History

Date Modified Username Field Change
2017-01-06 19:09 cproensa New Issue
2017-01-06 19:10 cproensa Tag Attached: modern-ui
2017-03-27 19:42 cproensa Note Added: 0056231
2017-03-27 20:21 vboctor Note Added: 0056232
2017-03-27 20:32 vboctor Note Edited: 0056232 View Revisions
2017-03-28 04:40 atrol Note Added: 0056233
2017-03-28 05:41 cproensa Note Added: 0056234
2017-04-14 14:52 cproensa Note Added: 0056552
2017-04-14 14:53 cproensa Relationship added has duplicate 0021817
2017-04-14 14:54 cproensa Relationship added related to 0021818
2017-04-14 14:54 cproensa Summary view_all_bug_page issues table gets off screen and cant be scrolled conveniently => Some tables gets off screen and cant be scrolled conveniently
2017-08-16 17:34 cproensa Assigned To => cproensa
2017-08-16 17:34 cproensa Status new => assigned
2017-08-19 14:05 cproensa Relationship added has duplicate 0021702
2017-09-11 07:51 cproensa Relationship added related to 0023335