tapestry/tapestry-examples/TimeTracker/src/context/LocaleSuggest.html

<span jwcid="@Border">

<p>
Autocompleting input suggestion fields using the <a href="http://script.aculo.us/">script.aculo.us</a> javascript library.
</p>

    <style type="text/css">
        div.autocomplete {
            position:absolute;
            width:250px;
            background-color:white;
            border:1px solid #888;
            margin:0px;
            padding:0px;
        }
        div.autocomplete ul {
            list-style-type:none;
            margin:0px;
            padding:0px;
        }
        div.autocomplete ul li.selected { background-color: #ffb;}
        div.autocomplete ul li {
            list-style-type:none;
            display:block;
            margin:0;
            padding:4px 0 4px 4px;
            cursor:pointer;
        }
        div.autocomplete ul li img { border:none; margin-right: 10px; vertical-align:middle;}
    </style>

    <form jwcid="@Form" class="container">
        <h3>Locale suggestion</h3>
        
        <fieldset>
             <table width="90%" class="form" cellpadding="2" cellspacing="0" >
                 <tbody>
                     <tr>
                         <td><label jwcid="@FieldLabel" field="component:suggest" /></td>
                         <td><input jwcid="suggest" size="34" /></td>
                     </tr>
                 </tbody>
             </table>
        </fieldset>
    </form>

</span>