here's what I currently have, unfortunately I cannot seem to figure out how to get autoFill to work with jQuery-UI... It used to work with the straight up Autocomplete.js
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.1.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
var thesource = "RegionsAutoComplete.axd?PID=3"
$(function () {
function log(message) {
$("<div/>").text(message).prependTo("#log");
$("#log").attr("scrollTop", 0);
}
$.expr[':'].textEquals =
function (a, i, m) {
return $(a).text().match("^" + m[3] + "$");
};
$("#birds").autocomplete({
source: thesource,
change:
function (event, ui) {
//if the value of the textbox does not match a suggestion, clear its value
if ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0) {
$(this).val('');
}
else {
log(ui.item ? ("Selected: " + ui.item.value + " aka " + ui.item.id) : "Nothing selected, input was " + this.value);
}
}
}).live('keydown',
function (e) {
var keyCode = e.keyCode || e.which;
//if TAB or RETURN is pressed and the text in the textbox does not match a suggestion, set the value of the textbox to the text of the first suggestion
if ((keyCode == 9 || keyCode == 13) && ($(".ui-autocomplete li:textEquals('" + $(this).val() + "')").size() == 0)) {
$(this).val($(".ui-autocomplete li:visible:first").text());
}
});
});
</script>
I've used the answer here to get the mustMatch working, but unfortunately if I "tab" away from the input box, I get the "Nothing selected" response instead of an Value and ID.
Does anyone know how to extract the ID out of the autocomplete when you don't actually select the field?
