autocomplete基本用法

<style type="text/css">

.ui-autocomplete-loading {
background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat;
}
.ui-autocomplete {
max-height: 260px;
overflow-y: auto;
prevent horizontal scrollbar
overflow-x: hidden;
/* add padding to account for vertical scrollbar */
padding-right: 20px;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
height: 100px;
}

</style>

$(document).ready( function() {

//兼容火狐浏览器
$('#user').bind( "input.autocomplete", function(){
$(this).trigger('keydown.autocomplete');
}) ;


$( "#user" ).autocomplete({
source: function( request, response ) {
$("#userId").val("");
$.ajax({
url: "${ctx}/view/base/ViewTaskIndicators.action?getUserList=",
data:"userName=" + encodeURI($("#user").val()),

success: function( data ) {
response( $.map( data, function( item ) {
//手动输入文字不选择也可获得所需信息
if(item.name==$("#user").val()){
$("#userId").val(item.id);
}

return {
label: item.name+"("+item.id+")",//下拉框中所显示的内容
value: item.id + ";" + item.name
}
}));
}
});
},
minLength:1,
select: function( event, ui ) {
$("#userId").val(ui.item.value);
},
focus: function() {
return false;
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
$("#user").val($("#userId").val().split(";")[1]);
$("#userId").val($("#userId").val().split(";")[0]);
}
});
}

逻辑代码
public Resolution getUserList() {

service = getBean("taskIndicatorsService", TaskIndicatorsService.class);

List<UserEntity> getUserList = service.getUserList(userName, null);

return new JSONResolution(getUserList);
}

public Resolution taskIndicatorsList() {
// 人员
getUserList();

return new ForwardResolution(
"/jsp/report/base/taskIndicators/taskIndicatorsList.jsp");
}