Vaadin: Dynamically change a textfield's background color

Question

How does one dynamically change a textfield's visual properties, say background color?

An example might be during a validation to modify the background color dependent on the value entered.

Answer 1

Here is the sample

.v-textfield-dashing     
{    
    border:     thin dashed;    
    background: white; /* Has shading image by default */    
}

Detailed information you will get on this link. https://vaadin.com/book/-/page/components.textfield.html

And if you want to change textfield color dynamically then you will get content on below link https://vaadin.com/wiki/-/wiki/Main/Dynamically%20injecting%20CSS

Answer 2

In your war (this will be inside WebContent if you are using ecilpse) have a file in this path VAADIN/themes/customrunno/styles.css (asuming you are using runno as your theme)

With this content:

@import url(../runo/styles.css);

.my_bg_style {
     background: #99EE6B;  
}

In your init method:

setTheme("customruno"); // same as the folder folder under VAADIN/themes

change your textfield background:

textField.addStyleName("my_bg_style"); // same as in styles.css

to remove the style just do:

textField.removeStyleName("my_bg_style");