Scrollable Autocomplete

maxShowItems set to 2, minWidth=175px (to approximate input width)
selection list = apples, s.o.b, peache, pears, plums, tell me,something, let's put something really big with extraordinary width here,AbstractAction,AbstractAnnotationValueVisitor6.


 

 



Dependencies
<link rel="stylesheet" href="scripts/jquery-ui-1.12.1/jquery-ui.css">
<script src="scripts/jquery-3.3.1.js">
<script src="scripts/jquery-ui-1.12.1/jquery-ui.js"></script>
	
<script src="scripts/jquery.ui.autocomplete.scroll.k.js"></script>
The last js script listed is a forty-five line modified version of script originally from https://anseki.github.io/jquery-ui-autocomplete-scroll/ which enables scrolling.

In addition there are seventy-five lines of javascript on this page which includes the code necessary for any jquery autocomplete implementation. More code is also mixed in those lines to be able to select a label from the selection list while saving it's index to a hidden field. This saving the index code is based on code referenced here: https://stackoverflow.com/questions/4815330/jquery-ui-autocomplete-with-item-and-id

Additional features of this page include setting the minimum width of the scroll and a pseudo regex which allows search from first character. By default, autocomplete searches all labels without regard to position. "ea" will match "peach" or "really", and not just "each" or "early". Most autocomplete implementations display the later behavior, most commonly searching for states. Enter "ar" and you will match Arizona and Arkansas, but not Maryland, nor North Carolina. To allow for either type of search, if the user enters a '^' at the beginning of the input, the match will follow the narrower search, and attempt matching only selections that begin with the entered input. A useful side effect of this configuration is that a '^' by itself will display the entire list from which to select. Actual regex searching is easily implemented, but avoided due to complexity to user (familiarity with regex needed, and escape of regex characters not intended as such).