BuyLog In
Ticket Q365005
Visible to All Users

ASPxDocking - How to change a default 'z-index' value of ASPxDockPanel

created 13 years ago

Hi,
We're using the docking and have followed the widgets sample. We also have an ASPxScheduler on the same page and some ther pop up controls.
The problem we have is that the default z-order for the docking widgets means that they always sit on top all other pop ups, this includes the ASPxScheduler popup menu.
How can change the default z-order for the widget panels?
Thanks
Glynn

Sign in to comment on this post

Answers approved by DevExpress Support

created 13 years ago (modified 12 years ago)

The 'z-index' CSS style is directly rendered into the 'style' attribute of the ASPxDockPanel HTML-element. To make a browser use another z-index for ASPxDockPanel, you can create the following custom CSS class:

CSS
.lowZIndexPanel  
{  
    z-index:101 !important;  
}

and assign this class name to the ASPxGockPanel.CssClass property:

ASPx
<dx:ASPxDockPanel ID="panel1" runat="server" ... CssClass="lowZIndexPanel">  
.....

Let us know whether or not it solves the issue.
Best regards,
Vladimir

    Show previous comments (4)
    DevExpress Support Team 13 years ago

      Hello Glynn:
      I regret to say that the attached example contains the basic markup of the ASPxSheduler, so it is difficult to test its functionality :

      ASPx
      <dxwschs:ASPxScheduler ID="ASPxScheduler1" runat="server">  
      </dxwschs:ASPxScheduler>

      Anyway, the cause of the issue seems to be clear. If the widgets are placed on the same page as the ASPxSplitter, they are shown above the scheduler elements independently of their z-indexes since the splitter renders the content of its panes in iframes. Certainly, any element in the iframe is shown below the elements from the main page.
      A possible workaround for this problem is to set the z-index property for this iframe. I have attached a sample that illustrates this solution.
      Thanks
      Kate.

      LJ LJ
      Leidy Johanna 11 years ago

        good morning:
        i have a issue about of z-index, first all, i have some splitters and the popup is in one of them. i made the class, as this:
        .lowZIndexPanel
        {
           z-index:101 !important;
        }
        and i wrote CssClass="lowZIndexPanel" in the popup control, but the popup is not working(always appear down of others splitters), please help me.
        pdt: sorry for the english, this is not my language, i speak in spanish.

        Mike (DevExpress) 11 years ago

          Hello Leidy,

          To process your recent post more efficiently, I created a separate ticket on your behalf: T142472: ASPxSplitter and ASPxPopupControl z-index issue. This ticket is currently in our processing queue. Our team will address it as soon as we have any updates.

          Sign in to comment on this post

          Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

          Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.