A combo box for the web


In most software we can see this kind of modifiable drop-down lists :


But this is never seen on web pages, since no html control exist for that. There are either simple inputs, or simple drop-down lists.

But here is an example of a list that can be selected, AND modified.


How to use : copy and paste the following code in your page.
<script language="javascript"> function showhide(textb) { var calql = document.getElementById('lbname'); if (calql.style.visibility == 'visible') calql.style.visibility = 'hidden'; else { calql.style.visibility = 'visible'; calql.focus(); } } function getValue(listd) { textb = document.getElementById(listd.id.substring(2, listd.id.length)); textb.value=listd.item(listd.selectedIndex).value; listd.style.visibility = 'hidden'; textb.focus(); textb.select(); } </script> <input type='text' id='name' value='' size='25'> <input type='button' id='bname' value='...' onClick='showhide(this);'> <select id='lbname' size='10' style='position:absolute;visibility:hidden;' onClick='getValue(this);' onBlur='style.visibility = "hidden";'> <option value='Alpha' > Alpha </option> <option value='Beta' > Beta </option> <option value='Gamma' > Gamma </option> <option value='Delta' > Delta </option> <option value='Epsilon' > Epsilon </option> <option value='Dzeta' > Dzeta </option> <option value='Theta' > Theta </option> <option value='Iota' > Iota </option> <option value='Kappa' > Kappa </option> <option value='Lambda' > Lambda </option> <option value='Mu' > Mu </option> <option value='Nu' > Nu </option> <option value='Xi' > Xi </option> <option value='Omicron' > Omicron </option> <option value='Pi' > Pi </option> <option value='Rho' > Rho </option> <option value='Sigma' > Sigma </option> <option value='Tau' > Tau </option> <option value='Upsilon' > Upsilon </option> <option value='Phi' > Phi </option> <option value='Khi' > Khi </option> <option value='Psi' > Psi </option> <option value='Omega' > Omega </option> </select>