jQuery UI Autocomplete and Enter Key

by bizamajig

HTML

<div id="form">
    <input id="ac" type="text" />
    <input type="text" />
</div>

<ul id="log"></ul>

JavaScript

var words = ["P", "Pa", "Paar", "Pablo", "Pablum", "Pabst", "Pace", "Pacheco", "Pacific", "Pacino", "Packard", "Paderewski", "Padilla", "Paganini", "Page", "Paglia", "Pahlavi", "Paige", "Paine", "Pakistan", "Pakistani", "Pakistanis", "Palau", "Palembang", "Paleocene", "Paleogene", "Paleolithic", "Paleozoic", "Palermo", "Palestine"];

$("#ac").autocomplete({
    source: words,
    select: function(event, ui) {
        $("#log").append($("<li />").text("You selected '" + ui.item.value + "'"));

				var originalEvent 													= event,
					input__event_type												= '',
					input__selection_type											= '';

				while ( originalEvent ) {
					if ( originalEvent.keyCode 										=== 13 ) {
						originalEvent.stopPropagation();
					}
					if ( originalEvent 												=== event.originalEvent ) {
						break;
					}
					originalEvent 													= event.originalEvent;
				}

				input__event_type													= originalEvent.type;
				
				if ( input__event_type 												=== 'menuselect' ) { // selected by keyboard instead of mouse/touch
					input__selection_type											= 'menuselect'
				}
/*DEBUG AUTOCOMPLETE*/console.log( 'DEBUG - AUTOCOMPLETE - SELECT EVENT IS', input__event_type );
    }
});

$("#form").keydown(function(event) {
    if (event.keyCode == 13)
        $("#log").append($("<li />").text("Enter key detected"));
});