visually customize autocomplete in Wicket

Question

Hi,

How can I visually customize autocomplete fields in Wicket (change colors, fonts, etc.)?

Answer 1

You can use CSS to modify the look of this component. For the Ajax auto-complete component in 1.3 the element you want to override is div.wicket-aa, so for example you might do:

div.wicket-aa {
    background-color:white;
    border:1px solid #CCCCCC;
    color:black;
}
div.wicket-aa ul {
   list-style-image:none;
   list-style-position:outside;
   list-style-type:none;
   margin:0pt;
   padding:5px;
}
div.wicket-aa ul li.selected {
    background-color:#CCCCCC;
}

Answer 2

Perilandmishap has probably the most usefull answer for your needs. Personally, I always found the default Ajax auto complete control in Wicket to be woefully insufficient for my needs. If you really want a professional "feel" to your auto complete, roll your an using Wicket's Ajax libraries.