What's New?

[CLOSED] [1.0] Rendering Chart/Flash behind Model Window

  1. #1
    Nov 04, 2010, 6:46 PM

    [CLOSED] [1.0] Rendering Chart/Flash behind Model Window

    I'm having a little issue with charts rendering behind a model window. I know it's because I can't set the <param name="wmode" value="opaque">, but I'm not sure if this is possible or how to do it. Any insides would be appreciated.

    Here are before and after images so you can see what I mean.
    Attached Thumbnails Click image for larger version.  Name: before.jpg  Views: 193  Size: 97.7 KB  ID: 1841   Click image for larger version.  Name: After.jpg  Views: 207  Size: 90.3 KB  ID: 1842  
    Last edited by Daniil; Nov 12, 2010 at 7:38 AM. Reason: Marked as [CLOSED]. No more information was provided.
  2. #2
    Nov 04, 2010, 6:49 PM
    Quote Originally Posted by ljankowski View Post
    I'm having a little issue with charts rendering behind a model window. I know it's because I can't set the <param name="wmode" value="opaque">, but I'm not sure if this is possible or how to do it. Any insides would be appreciated.

    Here are before and after images so you can see what I mean.
    Just noticed, this only happens in Safari.

    IE and Firefox seem unaffected.


    Is there a way I can set the style of the window so I can change the z-index. I believe this is what is needed....

    I'm rendering the window like below.

      var printWindow = function (url) {
            new parent.parent.Ext.Window(Ext.apply({
                renderTo: parent.parent.Ext.getBody(),
                resizable: true,
                id: "wWIPPrint",
                title: "Print Window",
                closable: true,
                closeAction: "close",
                initCenter: true,
                draggable: true,
                modal: true,
                height: 500,
                width: 900,
                maximizable: true,
                autoLoad: {
                    maskMsg: "Generating Inspection...",
                    showMask: true,
                    nocache: true,
                    mode: "iframe",
                    url: url
                }
            })).show();

        }
  3. #3
    Nov 04, 2010, 10:32 PM
    Hi,

    Yes, it looks like there is possible to solve using respective css rules.

    Could you provide a sample code to test?
  4. #4
    Nov 04, 2010, 10:43 PM
    Generally speaking, to apple your css rules for Window you can use the cls property. Maybe baseCls property can help to solve this.
    http://dev.sencha.com/deploy/dev/doc...member=baseCls
    Example
    var printWindow = function (url) {
          new parent.parent.Ext.Window(Ext.apply({
              id: "wWIPPrint",
              cls: "yourCssClass"

          })).show();
 
      }
  5. #5
    Nov 04, 2010, 11:10 PM
    Hi again,

    Here is a simple example to demonstrate the above.

    If you remove the Window1's Cls property it will became invisible after initial page loading. Tested under IE8 and FF 3.6.

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.Net Example</title>

    <style type="text/css">
        .myClass {
            z-index: 10000 !important;
        }
    </style>
</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    <ext:Window 
        runat="server" 
        Title="Window1" 
        Cls="myClass"/>
    <ext:Window 
        runat="server" 
        Title="Window2" 
        Width="300" 
        Height="300"/>
    </form>
</body>
</html>
  6. #6
    Nov 05, 2010, 1:42 PM
    That didn't seem to correct my problem.

    I just found something that fixes it, but it won't work for me. First let me explain my layout

    I have a viewport
    --> center panel
    --> Viewport
    --> North/South(South contains tabpanel)

    Each tab is another viewport inside of it, because they are all loading via IFrames and Autoloads. This is to keep it modular and easy to expand.

    If I render the window just one level high (example over centerpanel IFrame) it works correctly and I don't have any issues. It's when I render it another level higher. (ex parent.parent) is when the issue occurs. However I need to render it to the main body of the first viewport only because i need it to overlay everything on the screen included the west navigation on my first page. If I don't it fits the container of the centerpanel. Any advice?

     var printWindow = function (url) {
            new parent.parent.Ext.Window(Ext.apply({
                renderTo: parent.parent.Ext.getBody(),
  7. #7
    Nov 05, 2010, 2:15 PM
    Well I did a hack, didn't really like doing it this way but it works for now.

    When I click on the print function that shows the window I hide the graph panel, and in the listener of the built window I put a listener on close to show the chart again. This prevents it from bleeding through the window. Again not really what I wanted to do, but it works.
  8. #8
    Nov 08, 2010, 7:24 PM
    Hi,

    Please clarify what Charts do you use?

    Could you send a test project with all specific dlls to investigate the issue?

    Just it's difficult to say something concrete without code.

    NOTE: Marked as [CLOSED]. No more information was provided.
    Last edited by Daniil; Jan 12, 2012 at 4:09 PM. Reason: Added note

Similar Threads

  1. [CLOSED] Is it possible to put a tooltip on chart legend or chart axis?
    By feanor91 in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 13, 2012, 2:12 PM
  2. Problem with Flash: swf loaded via Flash component reloads
    By eyej2002 in forum 1.x Help
    Replies: 0
    Last Post: Oct 01, 2011, 3:51 PM
  3. Model window horizontal scroll bar issue...
    By vs.mukesh in forum 1.x Help
    Replies: 0
    Last Post: Jun 23, 2010, 3:35 PM
  4. Load flash in the ext:Window
    By flaviodamaia in forum 1.x Help
    Replies: 1
    Last Post: Jun 01, 2009, 1:15 PM
  5. Load Flash in Window
    By flaviodamaia in forum 1.x Help
    Replies: 4
    Last Post: Apr 30, 2009, 9:15 AM

Posting Permissions