I am facing an issue with my GWT application where I am trying to display the selected row in a FlexTable. To achieve this, I have added a style to the specific row using the following code:
@UiField FlexTable productTable;
int row;
[...]
/* select row */
productTable.getRowFormatter().addStyleName(row, "row-selected");
However, when I add the corresponding style in my ui.xml file as shown below, it does not work properly:
ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
xmlns:g="urn:import:com.google.gwt.user.client.ui"
xmlns:u="urn:import:myapplication.client.ui">
<ui:style>
tr.row-selected {
background: #92C1F0;
}
</ui:style>
<g:VerticalPanel>
<g:ScrollPanel>
<g:FlexTable ui:field="productTable" width="100%" height="100%">
</g:FlexTable>
</g:ScrollPanel>
</g:VerticalPanel>
</ui:UiBinder>
Upon inspecting the styles using FireBug, I noticed that the name tr.row-selected is being transformed into something like: tr.GB1HWLGEI. This is causing the style to not be applied correctly.
I would like to know why this issue is happening and how it can be resolved effectively.