PDA

View Full Version : [FIXED] Fields disappearing on Click on FormPanel (Demo attached)



jraue
11 Jul 2008, 6:22 AM
Hi folks,

In our application we have a FormPanel with some TextFields. Some of them need to be capable to display beside the text a CheckBox in certain cases based on a boolean given in the constructor (imagine it a bit like bul processing in iTunes).

For that, I created a class ConfigurableTextField that derives from MultiField and contains a TextField and a CheckBox. When I add this to a FormPanel, I experience a strange effect: When entering text in multiple fields or clicking CheckBoxes or even on the form some TextFields disappear. You can easily see that in attached sample code.

Maybe I am doing something in my code or it is a bug. Either way, I am glad for hints on how to overcome that. NB: The effect only shows if the FormPanel is child to somthing else (HorizontalPanel in the sample code). If you add it to the ViewPort directly, everything works.

Thanks a lot for your help, guys. GXT rocks!

Joachim





public class ClientTest extends LayoutContainer implements EntryPoint {

protected static final boolean CONFIGURABLE = false;

protected static final int WIDTH_PROPERTY_PANEL = 420;
protected static final int WIDTH_LABEL = 150;
protected static final int WIDTH_FIELD = 210;

/**
* This is the entry point method.
*/
public void onModuleLoad() {
final Viewport viewport = new Viewport();
viewport.setLayout(new FillLayout());

final HorizontalPanel hp = new HorizontalPanel();

final FormPanel formPanel = new FormPanel();
formPanel.setHeading("My Form Panel");
formPanel.setFieldWidth(WIDTH_FIELD);
formPanel.setLabelWidth(WIDTH_LABEL);
formPanel.setLabelAlign(LabelAlign.RIGHT);
formPanel.setBorders(false);
formPanel.setFrame(true);
formPanel.setWidth(WIDTH_PROPERTY_PANEL);

final ConfigurableTextField d1TextField = addTextField(formPanel, "Value 1", 1);
final ConfigurableTextField d2TextField = addTextField(formPanel, "Value 2", 2);
final ConfigurableTextField d3TextField = addTextField(formPanel, "Value 3", 3);
final ConfigurableTextField d4TextField = addTextField(formPanel, "Value 4", 4);

hp.add(new Text("Imagine other elements here"));
hp.add(formPanel);
viewport.add(hp);
RootPanel.get().add(viewport);
}

protected ConfigurableTextField addTextField(final FormPanel parentContainer, final String fieldLabel, final int fieldId) {
final ConfigurableTextField textField = new ConfigurableTextField(fieldId, CONFIGURABLE);
textField.setFieldLabel(fieldLabel);
parentContainer.add(textField);
return textField;
}

class ConfigurableTextField extends MultiField<Field<?>> {

int fieldId;

TextField<String> textField;
CheckBox configCheckBox;

public ConfigurableTextField(final int fieldId, final boolean configurable) {
super();

this.fieldId = fieldId;

textField = new TextField<String>();
add(textField);

if (configurable) {
configCheckBox = new CheckBox();
add(configCheckBox);
}
}

public int getFieldId() {
return fieldId;
}

@Override
public void setWidth(final int width) {
if (configCheckBox != null) {
textField.setWidth(width - 30);
configCheckBox.setWidth(20);
} else {
textField.setWidth(width);
}

super.setWidth(width);
}
}
}

darrellmeyer
14 Jul 2008, 10:27 PM
I tested your code and did not have any problems. Can you use firebug to inspect the DOM to see what is going on with the missing fields?

jraue
15 Jul 2008, 4:46 AM
Darrell,

I just had a close look into it. The code does work fine with Firefox and Opera, however the problem described clearly appears in IE (Tested under Vista, presumingly XP is also affected).

You can quickly see it if you type text into one field. When you then tick a checkbox the other TextFields disappear.

darrellmeyer
15 Jul 2008, 6:37 AM
I previously tested your code in IE. Are you using any custom CSS? Can you use IE Developer Toolbar to look at the DOM when the fields disappear to see what styles are being applied that might be cause this issue?

jraue
16 Jul 2008, 11:38 PM
I am not using any custom CSS. Using the dev toolbar, I cannot really draw conclusions myself. The style for the INPUT element remains the same it seems, however it is suddenly positioned way off (see attached pic). The TD element stays where it should be. What do you think it could be? Can you also see this behavior with my code in IE?

jraue
16 Jul 2008, 11:42 PM
Again with better readability

darrellmeyer
17 Jul 2008, 6:33 AM
Try increasing your field width. If that does not work,compile your test module, zip up the www folder, and send me the file.

jraue
17 Jul 2008, 10:01 PM
Increasing the field width (up to 800) did not work. The zip file was too large to post in the forum (535 KB). I put it for you online at this page (http://www.informatik.uni-freiburg.de/~raue/formPanelTest.zip) temporarily. Thanks a lot!

posta07
24 Jul 2008, 1:50 PM
Have you found anything with this?

I experience something similar, however, instead of disappearing fields, my field is shifted upward onto the tabs in a tabPanel.

gslender
24 Jul 2008, 3:29 PM
could be doctype

posta07
24 Jul 2008, 3:31 PM
No :-/ Not doctype.
My doctype is correct.

Thanks though.

darrellmeyer
24 Jul 2008, 6:57 PM
Fix is in SVN.

jraue
30 Jul 2008, 11:30 PM
What doctype do you mean? Any news? Thanks, guys!

gslender
30 Jul 2008, 11:46 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

posta07
31 Jul 2008, 4:29 AM
What doctype do you mean? Any news? Thanks, guys!

The GWT 1.5 application creator automatically uses this doctype in the client/public/<modulename>.html file: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

GXT doesn't work well with that one.

Use the aforementioned (gslender's recommendation) doctype:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

jraue
11 Aug 2008, 12:02 AM
Problem with afore-posted code persists in GXT 1.0.2, which, I assume, was released after your fix.

@posta07: Thanks for your clarification, I already use <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

jraue
27 Aug 2008, 8:18 AM
Please change the thread title -- this issue is not fixed as of GXT 1.0.2, thanks!