1. 首先定义一个文本框
<input
type
=
"hidden"
id
=
"somethingId"
value
=
"-1"
>
<input
type
=
"text"
class
=
"form-control grayTips"
id="somethingName" placeholder="请输入名称">
2. js处理
var somethingData= null; // 名称联想的数据源
/**
名称联想输入
*/
$(
"#somethingName"
).autocomplete({
source: somethingData
,
select:
function
(event, ui){
$(
"#somethingId"
).val( ui.item.value );
$(
"#somethingName"
).val( ui.item.label );
// 必须阻止事件的默认行为，否则
autocomplete
默认会把ui.item.value设为输入框的value值
event.preventDefault();
}
});
/**
初始化名称列表信息
*/
function
qrySomethingInfo(){
$.ajax({
url : ctx +
"/something/ingcomplete.html"
,
async :
true
,
type :
"POST"
,
dataType :
"json"
,
data : {
},
success :
function
(data) {
for
(
var
i=0;i<data.obj.length;i++){
var
item = data.obj[i];
somethingData
.push({
'label'
:item.SOMETHING_NAME,
'value'
:item.SOMETHING_ID
});
}
}
});
}
3. 后台处理
/**
* 名称列表查询
*
*
@param
request
*
@param
modelMap
*
@return
*/
@RequestMapping
(value =
"ingcomplete"
)
@ResponseBody
public
AjaxJson autocompleteSomething(HttpServletRequest
request
, ModelMap
modelMap
, HttpSession
session
) {
AjaxJson
ajaxJson
=
new
AjaxJson();
/** 获取数据 */
// 获取系统当前用户所属公司
String
companyId
= StringUtil.
nvl
(SessionManager.
getUser
().getFarmId());
try
{
/** 检索条件 */
Map<String, String>
param
=
new
HashMap<String, String>();
param
.put(
"companyId"
,
companyId
);
/** 查询与当前登录人关联的某名称列表 */
List<Map>
somethingList
=
somethingServiceI
.searchSomethingList(
param
);
ajaxJson
.setObj(
somethingList
);
ajaxJson
.setMsg(CmnConstance.
COMMIT_SUCCESS_MSG
);
ajaxJson
.setSuccess(
true
);
}
catch
(Exception
e
) {
e
.printStackTrace();
ajaxJson
.setMsg(CmnConstance.
SYSTEM_ERROR_MSG
);
ajaxJson
.setSuccess(
false
);
}
return
ajaxJson
;
}