jQuery UI Autocomplete and DropDownList problems

[sanishan]

I am trying to use jQuery in a form. A TextBox with an autocomplete (street) has to select the correct value (town) in a DropDownList. This is the code:\[code\]<link rel="stylesheet" type="text/css" href="http://stackoverflow.com/questions/styles/jquery-ui-1.9.2.custom.css" /> <script src="http://stackoverflow.com/questions/scripts/jquery-1.8.3.js" type="text/javascript"></script> <script src="http://stackoverflow.com/questions/scripts/jquery-ui-1.9.2.custom.js" type="text/javascript"></script> <script> $(function () { $("#street").autocomplete({ source: function (request, response) { $.ajax({ url: "ws.asmx/GetStreets", data: "{ 'prefix': '" + request.term + "' }", dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", success: function (data) { response($.map(data.d, function (item) { return { value: item.Street.toString() } })) }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); } }); }, minLength: 2, select: function (event, ui) { $.ajax({ url: "ws.asmx/GetTown", data: "{ 'street': '" + $("#street").val() + "' }", dataType: "json", type: "POST", contentType: "application/json; charset=utf-8", success: function (data) { $("#DropDownListTown option").filter(function () { return $(this).text() == data.d; }).attr('selected', true); }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); } }); } }); }); </script>\[/code\]Iw sort of works but I have some issues:Could/should this be done in a simpler way (perhaps one DB Call in stead of two)?andIt only works if I use arrow keys to select street, if I mouse click on the autocomplete list, it sends the typed value (e.g. "be") in stead of the selected value (e.g. "Beach Road") to the webservice. Why does it not work with mouse click?and finally:It's very slow. From the typing to the autocomplete it takes a few seconds even though I am running it on local host. Is bad syntax slowing it down?Your help is much appreciatedEDIT: Mouse-Click issue resolved by using ui.item.value as described here:jQuery UI autocomplete select event not working with mouse clickBut I would still like ideas on simplifying and speeding up the script, thanks