CellTable - style specific columns

155 views
Skip to first unread message

Kevin Buikema

unread,
Aug 27, 2012, 3:43:19 PM8/27/12
to google-we...@googlegroups.com
I'm using a CellTable element via UIBinder, and I'm trying to come up with a way to simply style specific columns in the table to make them look distinct. To make it as simple as possible, I set up a separate css style for them:

.special_column_style {
  background-color: pink;
}

and used the code

table.addColumnStyleName(colIndex, "special_column_style");

...and it does nothing. Is there additional setup for the table that needs to be done to make the above code work? It seems like it should be simple, and yet it does nothing.

Kevin Buikema

unread,
Aug 27, 2012, 4:41:53 PM8/27/12
to google-we...@googlegroups.com
Doing some additional debugging, it appears the browser is unable to locate "special_column_style", because GWT translates the css file into it's own custom resource. Is there some way I can figure out what GWT transforms my css into, so I can set that style class for a column?

Jens

unread,
Aug 27, 2012, 5:55:41 PM8/27/12
to google-we...@googlegroups.com
How have you specified your CSS? Do you use UiBinder with inline CssResource? If so, take a look at https://developers.google.com/web-toolkit/doc/latest/DevGuideUiBinder#Programmatic_access . Instead of adding "special_column_style" to the column you would call the CssResource method for that css class to get the obfuscated class name generated by GWT, e.g. table.addColumnStyleName(colIndex, tableStyles.specialColumnStyle());

-- J.

Kara Rawsonkara

unread,
Aug 27, 2012, 3:51:21 PM8/27/12
to google-we...@googlegroups.com
use css selectors to id your datagrid or cell table container. and by use child and exclusion selectors u should be able to spefic the style on the td. u can also use css expressions or some jsni for quick and dirty impl. however i woukd implement it using my own custom cells to render via safe html templates. this would allow u to not only wrap the inner content with a div for overflow handling and or tooltips. iylt would also be the easiest way to specify a class and or id name or other atreibutes. u could crawl it with the dom and element methods but i dont recommend that

Sent from my iPhone
--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-web-toolkit/-/YneTtXIy0mgJ.
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.

Andrei

unread,
Sep 7, 2012, 8:29:41 AM9/7/12
to google-we...@googlegroups.com
Kevin,

If you use an external CSS file, GWT does nothing to it. Your code should work perfectly well as long as you (1) have an external CSS file with the special_column_style class, and (2) provide a link to this CSS file in your host page.

Andrei
Reply all
Reply to author
Forward
0 new messages