PDA

View Full Version : Ext.Msg.config shows behind popup (Sheet) window



Akrion
26 Jul 2011, 12:22 PM
I noticed similar issue but for the Ext.JS framework so I decided to post this in the Touch specific forum since my project is dealing with Touch specifically.

Anyway the symptom as described in the title is that if I have a popup dialog and a Ext.Msg.config message. I show multiple messages before and after the popup and the issue is that in many cases the message is shown behind the popup. I noticed that the x-floating css has the following:

position: absolute !important;
z-index: 10000 !important;

Now the Ext.Msg and the sheet popup have exactly the same x-floating class and therefore since the z-index is exactly the same the message box is not shown.

Here is what I did:

1. Created custom css class with z-index of 10001 (1 bigger than the x-floating one):

.msg_floating
{
position: absolute !important;
z-index: 10001 !important;
}

2. Called the Ext.Msg with the show form so I can use the class:



Ext.Msg.show(
{
title: 'Cancel this X?',
width: 300,
cls: 'msg_floaitng',
buttons: Ext.MessageBox.YESNO,
fn: function(answer)
{
if (answer === "yes")
somedialog.hide();
},
icon: Ext.MessageBox.INFO
});


I am looking for a better solution of course. I an not sure also if the Sencha Team is aware of this issue.

Thanks.

jjerome
26 Jul 2011, 12:36 PM
... the class:



...
cls: 'msg_floaitng',
...


Was that just a typo in the thread or in your actual code? I'm not sure if you meant to spell floating that way. :-/

Akrion
26 Jul 2011, 12:50 PM
Was that just a typo in the thread or in your actual code? I'm not sure if you meant to spell floating that way. :-/

:)) Thanks. Typo on my end.