a mistake when set backgroun-color value

101 views
Skip to first unread message

wahaha

unread,
Nov 27, 2011, 10:44:29 PM11/27/11
to Google Web Toolkit
i write these code :

-------------------------------------------------------------------------------------------------------------------------------------
HorizontalPanel hp=new HorizontalPanel();
Label lbl=new Label("aaaaa");
hp.add(lbl);
hp.setWidth("300px");
hp.setHeight("300px");
DOM.setStyleAttribute(hp.getElement(), "backgroun-color", "red");
DOM.setStyleAttribute(hp.getElement(), "border", "1px solid red");
RootPanel.get().add(hp);
-------------------------------------------------------------------------------------------------------------------------------------

then it wongs,the developement mod console said :
java.lang.AssertionError: The style name 'background-color' should be
in camelCase format

Gal Dolber

unread,
Nov 28, 2011, 12:29:56 AM11/28/11
to google-we...@googlegroups.com
try with backgroundColor, also you don't need to use static methods

hp.getElement().getStyle().setBackgroundColor("red");


--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To post to this group, send email to google-we...@googlegroups.com.
To unsubscribe from this group, send email to google-web-tool...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.




--
Guit: Elegant, beautiful, modular and *production ready* gwt applications.

http://code.google.com/p/guit/




wahaha

unread,
Nov 28, 2011, 3:26:26 AM11/28/11
to Google Web Toolkit
i have tryed "backgroundColor",it have made a wong.
use the method you suggest it success.
why "backgroundColor" and "backgroun-color" both make a mistake?
is it a bug with gwt2.3?

wahaha

unread,
Nov 28, 2011, 6:41:20 AM11/28/11
to Google Web Toolkit
yes,i fond that the DOM.setStyleAttribute() method could not realize a
css attribute with the character "-" correctly.
it is a bug 操

Paul Robinson

unread,
Nov 28, 2011, 6:50:29 AM11/28/11
to google-we...@googlegroups.com
It's not a bug. Or at least, it's not a bug in GWT. This is the way CSS works with javascript...whenever you set styles in javascript you must use camel case, and in a css file you use hyphens. GWT was trying to stop you from making a mistake by pointing out that you had a hyphen in your css which is incorrect.

It's a pain, but it's not GWT's fault.

Paul

Drew Spencer

unread,
Nov 28, 2011, 7:16:27 AM11/28/11
to google-we...@googlegroups.com
Yeah, cueman is right.

You need to use camelCase ing GWT. But jQuery can accept both types:

jQuery can equally interpret the CSS and DOM formatting of multiple-word properties. For example, jQuery understands and returns the correct value for both .css({'background-color': '#ffe', 'border-left': '5px solid #ccc'}) and.css({backgroundColor: '#ffe', borderLeft: '5px solid #ccc'}). Notice that with the DOM notation, quotation marks around the property names are optional, but with CSS notation they're required due to the hyphen in the name. Source: http://api.jquery.com/css/

You need to use the DOM formatting, not the CSS one. Hope that helps.

Drew
Reply all
Reply to author
Forward
0 new messages