Changing background-color of focused TextItem not working

[rroy]

In SmartGwt 2.2, I created a TextItem and called setTextBoxStyle("myTextItem").
When the TextItem gets focus, I want to change the background color. Here's the CSS I use:

Here's my CSS for the TextItem:

.myTextItem,
.myTextItemFocused,
.myTextItemDisabled,
.myTextItemError,
.myTextItemHint,
.myTextItemDisabled {
padding:2px;
border:1px solid #6AA0BB;
background:rgb(230,241,247) url(./images/controls/text_input.gif) repeat-x scroll;
color:#333333;
}

.myTextItemHint {
font-size: 1em;
color: Gray;
}

.myTextItemFocused {
background-color: Yellow;
}

The hint does appear gray but the focused background is not changing to yellow. Anyone see a problem with the CSS? Is there a known bug about this? Is there a workaround?

[rroy]

I found the reason why changing the background on focus did not work. Hope this helps others who may have run into similar situations.

In my code, I set the title style to white text (on a bluish background) but when the TextItem got focus, the style reverted to black text. I was told to use setShowFocused(false) to prevent the style change. This caused the custom focus style for the TextItem to not be used when I wanted to change the background color to yellow on focus. The solution for me was to set the style for both the title base CSS class and the Focused class, like so:

.ups-column-label,
.ups-column-labelFocused {
...
}

so that the font remained whited on blue. I removed the setShowFocused(false) call. Now when focus is in the TextItem, I see the yellow background.

[flipside]

Thanks for the info. Could you mention how you are assigning myTextItemFocused in your code? I've found things like .setTitleStyle and .setHintStyle, but I haven't been able to find anything like .setFocusedStyle.

Cheers.

[Isomorphic]

Suffixes are added appended automatically to the base style name as the form item goes in to various states: "Focused", "Error", "Disabled".

[flipside]

Ah, right. Thanks.