Project

General

Profile

Actions
Copy link

Defect #41925

open

Context menu submenus close unintentionally on Gantt chart due to z-index conflict

Added by Mizuki ISHIKAWA 18 days ago. Updated 18 days ago.

Status:
New
Priority:
Normal
Assignee:
-
Category:
Gantt
Target version:
-
Start date:
Due date:
% Done:

0%

Estimated time:
Resolution:
Affected version:
6.0.1

Description

In the Gantt chart, when interacting with the context menu of a ticket, the submenus of the context menu close unintentionally if the cursor overlaps the resizable handle (used to adjust the table width).

This behavior seems to be caused by the z-index of the resizable handle being higher than the z-index of the context menu, causing the submenus to close unexpectedly when the cursor overlaps both elements.

Files

gantt-context-menu.gif (585 KB) gantt-context-menu.gif Mizuki ISHIKAWA, 2024-12-03 08:39
Actions
Copy link
 #1

Updated by Mizuki ISHIKAWA 18 days ago

You can resolve the issue by changing the z-index of the resizable handle to be smaller than the z-index of the context menu (40).

diff --git a/app/assets/javascripts/gantt.js b/app/assets/javascripts/gantt.js
index 6a42e5be9..ceb6d9a51 100644
--- a/app/assets/javascripts/gantt.js
+++ b/app/assets/javascripts/gantt.js
@@ -178,6 +178,7 @@ function drawSelectedColumns(){
         $(this).show();
         var column_name = $(this).attr('id');
         $(this).resizable({
+          zIndex: 30,
           alsoResize: '.gantt_' + column_name + '_container, .gantt_' + column_name + '_container > .gantt_hdr',
           minWidth: 20,
           handles: "e",
@@ -220,6 +221,7 @@ function resizableSubjectColumn(){
     alsoResize: '.gantt_subjects_container, .gantt_subjects_container>.gantt_hdr, .project-name, .issue-subject, .version-name',
     minWidth: 100,
     handles: 'e',
+    zIndex: 30,
     create: function( event, ui ) {
       $('.ui-resizable-e').css('cursor','ew-resize');
     }

Actions
Copy link

Also available in: Atom PDF