Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
changing disable widget appearance
Hi, this CaloSilva, from Brasil.
Please, somebody can help me change disable widget appearance? a textfield and a NativeSelect.
Customize the theme (css) for .v-disabled to change the appearance of disabled components. To only do it to a specific component, give that component a style name and theme ".mycomponentstylename .v-disabled"
Jens Jansson: To only do it to a specific component, give that component a style name and theme ".mycomponentstylename .v-disabled"
To be exact, correct selector is
And it doesn't work in IE6.
Ah yes. without the space.
Why doesn't it work in IE6? Quite standard CSS.
Jens Jansson: Why doesn't it work in IE6? Quite standard CSS.
Well, it's IE6. Do you need more explanation :P
Gentlemen, debtor for the answers.
He worked for textField.
He did not work for NativeSelect.
Some idea? Thanks
Use a brower tool like Chrome Inspector, Firefox Firebug or Internet Explorer Developer Tools to find out how the HTML changes when a component gets disabled, and modify it with css.
Please, Jens, I am not good in css. Or better, I do not know css. But I want to learn! You would have one link with a tutorial one teaching to useChrome Inspector, Firefox Firebug or Internet Explorer Developer Tools? I need to decide to change the appearance of this incapacitated element.
try it with firebug. It is available for Firefox and Chrome. Refer to the documentation: http://getfirebug.com/wiki/index.php/Main_Page
There's also available an introducing video at http://getfirebug.com/video/Intro2FB.htm.
The Chrome Developer Tools are very similiar to it.
Greetings and good luck,
Gentlemen, thanks a lot! I followed the advice and I looked the correct classroom to modify. I obtained!
And if some colleague to need, I made thus:
border: thin solid #0000ff;
that is, I removed the filter. It was thus:
One more time, debtor and a Happy New Year for all we.
Good that you got it fixed.
To use the built in Inspector of Chrome, just right click anywhere on a web page and select the last option, "Inspect Element".