MessageDlg() on secondary forms - Lock span not visible / too low z-index

[Olaf_Monien]

Empty WebCore app, two forms, no html/css involved.

MessageDlg() works fine on first/main form.

Secondary form is shown like this:

procedure TForm1.WebButton1Click(Sender: TObject);
var
  LForm2: TForm2;
begin
  LForm2 := TForm2.CreateNew;
  LForm2.ShowModal;
end;

The dialog shows up as expected, but the lock span (that should grey out/disable the underlying form) does not show. This is because TForm2 is rendered inside a span that has z-index = 999999 and the Dialog's lock span only has a z-index of 19990 - hence it's behind the form.

I guess that TWebForm.ShowModal and the modality of MessageDlg are conflicting in some way here.

[brunofierens]

I suggest to use the approach as shown in the demo Demo\Basics\MultiForm
I retested invoking a MessageDlg() from the popup form and this is handled correct.

[Olaf_Monien]

Thanks for following up. Unfortunately though, the MultiForm demo shows exactly the same behavior:
A MessageDlg() on TForm2 does not enable its lock span as it is supposed to.

This is the only code I modified in the demo:

procedure TForm2.WebButton2Click(Sender: TObject);
begin
//  Close;
  MessageDlg('Test', mtInformation, [mbOK]);
end;

I looked at the actual sources, to understand whats going on:

The Dialog itself shows up correctly, as it gets a high enough z-index:

edlg.style.setProperty('z-index', '1999998');

The lock span is probably supposed to get '1999000' or so, but there is probably an oversight, two missing zeros at the end:
eh.style.setProperty('z-index', '19990');

A secondary form appears to always have a z-index of 999998 , which is why the dialog itself works, but the lock span is never visible, i.e. does not lock the underlying form.

The primary/main form has z-index zero, which is why the lock span works as expected there.

[Olaf_Monien]

Another observation with that MultiForm demo:
If you chose "Popup Form" for Form 2, then calling MessageDlg from Form 2 locks Form 1 (which is still visible in the background) correctly, but it does not lock Form 2

You get these layers:
Form 1 = z-index 0
Lock Span = z-index 19.990
Form 2 = z-index 999.998
MesageDialog = z-index 1.999.998

[Olaf_Monien]

As a workaround, I put the following style into the main HTML file. The lock span doesn't have an ID or class name, so I had to apply some magic to the selector. Works fine here - the lock span moves up to the correct level.

The idea is simple: select any span, that lives at z-index 19.990 and pull it up to 1.999.000. There should only be one single of these spans - the one that is generated for dialogs and shouldn't interfere with "normal" spans (as long as they are not on that special 19.990 level...)

   span[style*="z-index: 19990"]{
            z-index: 1999000 !important
         }

Attached is the modified MultiFormDemo, that shows the fix:
Multiform.zip (6.9 KB)

• Open the secondary form
• On that secondary form click [Message Dialog]

Fix applied: -> Lock span correctly locks all underlying controls.
Fix not applied: -> Lock span sits too low and does not lock controls as expected.

[brunofierens]

We'll further investigate to find a solution out of the box.

[brunofierens]

We have applied a fix and can confirm this fix will be in the next TMS WEB Core update most likely released this week.