下载jquery autocomplete
[b]
<script type="text/javascript" src="${webRoot}/js/jquery-1.8.0.min.js"></script>
<link rel="stylesheet" type="text/css" href="${webRoot}/css/jquery.autocomplete.css" />
<script type='text/javascript' src='${webRoot}/js/jquery.autocomplete.js'></script>
[/b]
[b]
页面使用
[/b]
[b]
当使用matchSubset:true时出现异常 s.toLowerCase();
[/b]
出问题的地方
解决办法,修改jquery.autocomplete.js,添加一个属性mustMatchPro
[b]
<script type="text/javascript" src="${webRoot}/js/jquery-1.8.0.min.js"></script>
<link rel="stylesheet" type="text/css" href="${webRoot}/css/jquery.autocomplete.css" />
<script type='text/javascript' src='${webRoot}/js/jquery.autocomplete.js'></script>
[/b]
[b]
页面使用
[/b]
$("#nameinfo").focus().autocomplete("${webRoot}/XXX.do", {
minChars:1,
width: 310,
autoFill: false,
dataType:'json',
mustMatchPro:'id',//填写缓存想要匹配的属性名称,这个是自定义的
extraParams:{sizeOfPage:50},//额外附加参数
parse:function(data){//返回结果集解析
var list=data.objects;
var arrayHtml = [];
if(null!=list&&list.length>0){
for(var i=0;i<list.length;i++){
var arrvalue={
id:list[i].id,
name:list[i].name,
showItem:list[i].showItem
};
arrayHtml.push(arrvalue);
}
}
//解析结果集
return $.map(arrayHtml, function(row) {
return {
data : row,//返回的行对象
value : row,
result :row.id//选中的结果
}
});
},//解析数据
formatItem: function(row, i, max) {
return row.showItem;
},
formatResult: function(item) {
return item.id;
}
}).result(function(e, item) {
//获取返回值
//alert(item.id);
});
[b]
当使用matchSubset:true时出现异常 s.toLowerCase();
[/b]
出问题的地方
function matchSubset(s, sub) {
if (!options.matchCase) s = s.toLowerCase();
//当前获得匹配项是json数组而不是字符串所以不支持这个方法
解决办法,修改jquery.autocomplete.js,添加一个属性mustMatchPro
$.Autocompleter.defaults = {
inputClass: "ac_input",
resultsClass: "ac_results",
loadingClass: "ac_loading",
minChars: 1,
delay: 400,
matchCase: false,
matchSubset: true,
[b] mustMatchPro:'id',[/b]
matchContains: false,
cacheLength: 10,
max: 100,
mustMatch: false,
extraParams: {},
selectFirst: true,
formatItem: function(row) { return row[0]; },
formatMatch: null,
autoFill: false,
width: 0,
multiple: false,
multipleSeparator: ", ",
highlight: function(value, term) {
return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
},
scroll: true,
scrollHeight: 180
};
function matchSubset(s, sub) {
if (!options.matchCase) {
try{
s = s.toLowerCase();
}catch(e){
s=s[options.mustMatchPro].toLowerCase();
}
}
var i = s.indexOf(sub);
if (options.matchContains == "word"){
i = s.toLowerCase().search("\\b" + sub.toLowerCase());
}
if (i == -1) return false;
return i == 0 || options.matchContains;
};