mask didnt appear behind modal window

[pipoo]

I have a tabpanel and show modal window dialog on the changing tab, but window dialog appear without mask. Im stuck please help me...
My entry point


public class ASSRD implements EntryPoint {
public void onModuleLoad() {
Viewport vp = new Viewport();
vp.setLayout(new CenterLayout());
vp.add(new ASSRDWidget());
RootPanel.get().add(vp);

}
}
main widget



public class ASSRDWidget extends ComponentComposite {

...

public ASSRDWidget() {
/*
* Main panel
*/

ContentPanel mainPanel = new ContentPanel();
mainPanel.setHeaderVisible(false);
mainPanel.setBodyBorder(false);
mainPanel.setWidth(800);
/*
* Tab Panel
*/
tabPanel = new TabPanel();
tabPanel.setAutoHeight(true);
tabPanel.setAutoWidth(true);
tabPanel.setPlain(true);
tabPanel.setSize(700, 600);

....

tabPanel.add(getSearchTab());

mainPanel.add(tabPanel);

initWidget(mainPanel);
}

Listener<ComponentEvent> listenerChangeTab = new Listener<ComponentEvent>() {
public void handleEvent(ComponentEvent be) {
showLoginWindow();
}
};

private void showLoginWindow() {

Window loginWindow = new Window();
loginWindow.setHeading("Please Login");
loginWindow.setSize(350, 160);
loginWindow.setLayout(new FitLayout());

loginWindow.setClosable(false);
loginWindow.setModal(true);
loginWindow.setShadow(true);
FormPanel form = new FormPanel();
form.setFrame(false);
form.setHeaderVisible(false);
form.setBodyBorder(false);
form.setBorders(false);

TextField<String> login = new TextField<String>();
login.setFieldLabel("Login");
TextField<String> password = new TextField<String>();
password.setFieldLabel("Password");
form.add(login);
form.add(password);
form.addButton(new Button("OK", listenerOKLogin));
form.addButton(new Button("Cancel", listenerCancelLogin));
loginWindow.add(form, new FitData(4));
loginWindow.show();

}
}
What i have done wrong?

[gslender]

try a dialog instead, and if that doesn't work, post a complete example showing the problem

[pipoo]

I try dialog and result is same... In previous post I put full code for exception services call

[gslender]

that is not complete code.

post an example, that compiles, that only does the problem you are facing as a single onModuleLoad example.

[pipoo]

I create test application and dialog appear same(( without mask panel under dialog
There is a code:


package com.testproject.testpackage.client;

import com.extjs.gxt.ui.client.Events;
import com.extjs.gxt.ui.client.event.ComponentEvent;
import com.extjs.gxt.ui.client.event.Listener;
import com.extjs.gxt.ui.client.widget.ContentPanel;
import com.extjs.gxt.ui.client.widget.Dialog;
import com.extjs.gxt.ui.client.widget.TabItem;
import com.extjs.gxt.ui.client.widget.TabPanel;
import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.extjs.gxt.ui.client.widget.form.TextField;
import com.extjs.gxt.ui.client.widget.layout.FitData;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class TestAplication implements EntryPoint {

public void onModuleLoad() {
/*
* Main panel
*/

ContentPanel mainPanel = new ContentPanel();
mainPanel.setHeaderVisible(false);
mainPanel.setBodyBorder(false);
mainPanel.setWidth(800);
/*
* Tab Panel
*/
TabPanel tabPanel = new TabPanel();
tabPanel.setAutoHeight(true);
tabPanel.setAutoWidth(true);
tabPanel.setPlain(true);
tabPanel.setSize(700, 600);

TabItem ti1 = new TabItem("Tab 1");
TabItem ti2 = new TabItem("Tab 2");
ti2.addListener(Events.Select, listenerChangeTab);
tabPanel.add(ti1);
tabPanel.add(ti2);

mainPanel.add(tabPanel);
RootPanel.get().add(mainPanel);
}

Listener<ComponentEvent> listenerChangeTab = new Listener<ComponentEvent>() {
public void handleEvent(ComponentEvent be) {
showLoginWindow();
}
};

private void showLoginWindow() {
Dialog loginWindow = new Dialog();
loginWindow.setHeading("Please Login");
loginWindow.setSize(350, 160);
loginWindow.setLayout(new FitLayout());
loginWindow.setClosable(false);
loginWindow.setModal(true);

loginWindow.setButtons("");
loginWindow.setIconStyle("user");
loginWindow.setHeading("Demo Login");
loginWindow.setBodyBorder(true);
loginWindow.setBodyStyle("padding: 8px;background: none");
loginWindow.setResizable(false);
FormPanel form = new FormPanel();
form.setFrame(false);
form.setHeaderVisible(false);
form.setBodyBorder(false);
form.setBorders(false);

TextField<String> login = new TextField<String>();
login.setFieldLabel("Login");
TextField<String> password = new TextField<String>();
password.setFieldLabel("Password");
form.add(login);
form.add(password);
form.addButton(new Button("OK"));
form.addButton(new Button("Cancel"));
loginWindow.add(form, new FitData(4));
loginWindow.show();
}
}

[sven]

Works fine for me.

Are you using the latest gxt version?

[pipoo]

lib: gwt 1.5, gxt 1.2

maybe something wrong with TestAplication.gwt.xml:


<module>

<!-- Inherit the core Web Toolkit stuff. -->
<inherits name='com.google.gwt.user.User' />
<inherits name='com.extjs.gxt.ui.GXT' />

<!-- Specify the app entry point class. -->
<entry-point
class='com.testproject.testpackage.client.TestAplication' />
<stylesheet src="js/ext/resources/css/ext-all.css" />
<script src="js/ext/adapter/ext/ext-base.js" />
<script src="js/ext/ext-all.js" />

</module>


or html page:



<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Author" content="Eugene Safronov" />
<title>Hello World</title>
<!-- The GWT js file generated at run time -->
<script type="text/javascript" src='com.testproject.testpackage.TestAplication.nocache.js'></script>
</head>

<body>
<div id="main"></div>
</body>

</html>

[gslender]

Your gwt.xml module file seems to be taken from GWT-EXT which is not Ext GWT or this forum.

If you are really using GXT, remove the last 3 enteries (the stylesheet and scripts)

Your hTML is missing doctype and ext-all.css style sheet.

My html looks like this...


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<!--include the ext gwt styles-->
<link rel="stylesheet" type="text/css" href="css/ext-all.css" />
</head>
<body>
<script language="javascript" src="com.mycompany.gxt.Test.nocache.js"></script>
</body>
</html>

[pipoo]

oh... gslender, thank you very much... I completely forgot that I started my project from using gwt ext and now turn to the ext gwt.)
But now explored one trouble with mask... for explaining I put a screenshot of my main application in attachment. In main application mask appear like gray stripe, but in test application showing properly. Difference between test and main application is entry point:

Main application


public class ASSRD implements EntryPoint {
public void onModuleLoad() {
Viewport vp = new Viewport();
vp.setLayout(new CenterLayout());
vp.add(new ASSRDWidget());
RootPanel.get().add(vp);

}
}
Test application


public class TestAplication implements EntryPoint {

public void onModuleLoad() {
/*
* Main panel
*/

ContentPanel mainPanel = new ContentPanel();
mainPanel.setHeaderVisible(false);
mainPanel.setBodyBorder(false);
mainPanel.setWidth(800);
/*
* Tab Panel
*/
TabPanel tabPanel = new TabPanel();
tabPanel.setAutoHeight(true);
tabPanel.setAutoWidth(true);
tabPanel.setPlain(true);
tabPanel.setSize(700, 600);

TabItem ti1 = new TabItem("Tab 1");
TabItem ti2 = new TabItem("Tab 2");
ti2.addListener(Events.Select, listenerChangeTab);
tabPanel.add(ti1);
tabPanel.add(ti2);

mainPanel.add(tabPanel);
RootPanel.get().add(mainPanel);
}

Listener<ComponentEvent> listenerChangeTab = new Listener<ComponentEvent>() {
public void handleEvent(ComponentEvent be) {
showLoginWindow();
}
};

private void showLoginWindow() {
Dialog loginWindow = new Dialog();
loginWindow.setHeading("Please Login");
loginWindow.setSize(350, 160);
loginWindow.setLayout(new FitLayout());
loginWindow.setClosable(false);
loginWindow.setModal(true);

loginWindow.setButtons("");
loginWindow.setIconStyle("user");
loginWindow.setHeading("Demo Login");
loginWindow.setBodyBorder(true);
loginWindow.setBodyStyle("padding: 8px;background: none");
loginWindow.setResizable(false);
FormPanel form = new FormPanel();
form.setFrame(false);
form.setHeaderVisible(false);
form.setBodyBorder(false);
form.setBorders(false);

TextField<String> login = new TextField<String>();
login.setFieldLabel("Login");
TextField<String> password = new TextField<String>();
password.setFieldLabel("Password");
form.add(login);
form.add(password);
form.addButton(new Button("OK"));
form.addButton(new Button("Cancel"));
loginWindow.add(form, new FitData(4));
loginWindow.show();
}
}
UPD
very interesting think, in web mode mask show properly in firefox 3.0.5, but render in the ie not properly