PDA

View Full Version : Gxt 2.0 Bottom border of TextFields not rendering



crazycatlady
10 Jul 2009, 4:56 AM
Only in Gxt 2.0 RC2 and the official release I am having a problem where the bottom border of my TextFields is not rendering. I setup a test case with the advanced forms example from the explorer and I have the same problem so I am assuming it is something with my css files. Besides the gxt.jar and copying the folders from resources to war, is there anything else that needs to be done with stylesheets?

crazycatlady
10 Jul 2009, 6:05 AM
I have verified that this occurs in IE6, but works fine in Firefox. Here is my test case, which is simply the form example from the explorer.


Window window = new Window();

RootPanel.get("playground").add(window);

FormData formData = new FormData("100%");
FormPanel panel = new FormPanel();
panel.setPadding(0);
panel.setFrame(false);
panel.setHeaderVisible(false);
panel.setBodyBorder(false);
panel.setButtonAlign(HorizontalAlignment.CENTER);
panel.setLayout(new FitLayout());

TabPanel tabs = new TabPanel();

TabItem personal = new TabItem();
personal.setStyleAttribute("padding", "10px");
personal.setText("Personal Details");
personal.setLayout(new FormLayout());

TextField<String> name = new TextField<String>();
name.setFieldLabel("First Name");
name.setValue("Darrell");
personal.add(name, formData);

TextField<String> last = new TextField<String>();
last.setFieldLabel("Last Name");
last.setValue("Meyer");
personal.add(last, formData);

TextField<String> company = new TextField<String>();
company.setFieldLabel("Company");
personal.add(company, formData);

TextField<String> email = new TextField<String>();
email.setFieldLabel("Email");
personal.add(email, formData);

tabs.add(personal);

TabItem numbers = new TabItem();
numbers.setStyleAttribute("padding", "10px");
numbers.setText("Phone Numbers");
numbers.setLayout(new FormLayout());

TextField<String> home = new TextField<String>();
home.setFieldLabel("Home");
home.setValue("800-555-1212");
numbers.add(home, formData);

TextField<String> business = new TextField<String>();
business.setFieldLabel("Business");
numbers.add(business, formData);

TextField<String> mobile = new TextField<String>();
mobile.setFieldLabel("Mobile");
numbers.add(mobile, formData);

TextField<String> fax = new TextField<String>();
fax.setFieldLabel("Fax");
numbers.add(fax, formData);

tabs.add(numbers);

panel.add(tabs);
panel.addButton(new Button("Cancel"));
panel.addButton(new Button("Submit"));

panel.setSize(340, 200);

window.add(panel);
window.show();

crazycatlady
10 Jul 2009, 9:36 AM
I think I should've posted this in the bugs forum. Can a moderator move this for me, or should I repost it there?

sven
10 Jul 2009, 9:37 AM
Can you reproduce this also in the explorer? If not, make sure you are using the latest resources. You shoudd also post which browser you use.

crazycatlady
10 Jul 2009, 10:02 AM
No, when I bring up the explorer in Internet Explorer 6 then it looks fine. When I bring my code in Firefox it looks fine, but in IE6 the borders are gone. I have checked the resources, but I will download the code again and replace it in case I missed something.

sven
10 Jul 2009, 10:08 AM
If the onlineexamples work for you and the same code isnt working for you locally, than something is wrong on your side. I guess you havent updated your css files correctly. There were changes that could make the border to not appear.

crazycatlady
10 Jul 2009, 10:59 AM
I replaced all of the folders from resources that I previously had in the war file from version M3. I checked the gxt-all.css and it is the newest version. Is there anything else I could be missing? Can you be more specific about what lines of code were changed so I can make sure those are in there?

crazycatlady
13 Jul 2009, 4:41 AM
We have setup two new projects on different computers to test this issue and we are still encountering the same problem in hosted mode and using Internet Explorer 6. Everything renders correctly in firefox using our code. I would really appreciate some assistance!

dakuowang
13 Jul 2009, 6:32 AM
wait answers

crazycatlady
13 Jul 2009, 6:48 AM
We looked at the source for the online exampes and saw that they also use the Resources stylesheet which is not referenced in the setup document:
<link rel="stylesheet" type="text/css" href="samples/css/resources.css" />

I added this to my host page and it fixed this problem with most of my TextBoxes. I am still having the problem where I have multiple TextBoxes in a MultiField<TextBox> so I still require some assistance.

moldoe
17 Jul 2009, 11:09 AM
I'm am facing the same issue. In FF3.0 and IE8 it looks fine but in IE7 is not. I'm using GXT 2.0.

jana
21 Jul 2009, 11:35 PM
i have the same problem... I override the style x-form-field in one of my css files but not sure if this has anything to do with it...

basically adding:

* {
font-family: arial, helvetica, tahoma, sans-serif;
}

to one of your application specif css files fixes this problem... this is included in Resources.css if you wish to just include this instead..

if someone can explain whats going on here that would help all of us!!!

vinicius.rabelo
22 Jul 2009, 4:24 AM
I also have the same problem...
In FF3.0 works fine, but in IE7 is not. I'm using GXT 2.0 and GWT 1.7.

moldoe
22 Jul 2009, 7:04 AM
Please, can anyone tell us what is the right way to fix this. I don't want to change font for my inputs just because they don't render well in IE7. This is definitely a bug.
Thanks, Daniel

sven
22 Jul 2009, 7:09 AM
We are looking into this what can cause it. It is not happening under all circumstances.

sven
24 Jul 2009, 11:01 AM
I commited a fix for this to SVN.