Adjunto este código que ya es muy conocido para las personas que trabajan con Scriptaculous. Sin embargo lo voy a postear para tener a la mano esta herramienta que varias veces utilizo. Otra razón del post es porque existen ciertos problemas o límites de usar esta librería JS que postearé más adelante.
Más adelante explicaré del último parámetro del Autocompleter y sus limitaciones
<head>
<style type="text/css">
div.autocompleter {
margin:0px;
padding:0px;
width:250px;
background:#F5F6CE;
border:1px solid #888;
position:absolute;
}
div.autocompleter ul {
margin:0px;
padding:0px;
list-style-type:#F5F6CE;
}
div.autocompleter ul li.selected {
background-color:#F7BE81;
}
div.autocompleter ul li {
margin:0;
padding:2px;
height:32px;
display:block;
list-style-type:none;
cursor:pointer;
}
</style>
</head>
<p>
<label for="bands_from_the_70s">Your favorite rock band from the 70's:</label>
<br />
<input id="bands_from_the_70s" autocompleter="off" size="40" type=" " value="">
</p>
<div id="band_list01" class="autocompleter" style="display:none"></div>
<script type="text/javascript">
var bandsList = [
'ABBA',
'AC/DC',
'Aerosmith',
'America',
'Ramones',
'REO Speedwagon',
'Rhythm Heritage',
'Rush',
'Sex Pistols',
'Slade',
'Steely Dan',
'Stillwater',
'Styx',
'Supertramp',
'Sweet',
'Three Dog Night',
'The Village People',
'Wings (fronted by former Beatle Paul McCartney)',
'Yes'
];
new Autocompleter.Local('bands_from_the_70s', 'band_list01', bandsList, { });
</script></div>
Más adelante explicaré del último parámetro del Autocompleter y sus limitaciones
Comentarios