jquery.autocomplete.js
$.ajax({
// try to leverage ajaxQueue plugin to abort previous requests
mode: "abort",
// limit abortion to this input
port: "autocomplete" + input.name,
dataType: options.dataType,
url: options.url,
data: $.extend({
q: encodeURI(lastWord(term)),
limit: options.max
}, extraParams),
success: function(data) {
var parsed = options.parse && options.parse(data) || parse(data);
cache.add(term, parsed);
success(term, parsed);
}
});
c# 后台接收代碼,我用的是ASHX文件
string q=System.Web.HttpUtility.UrlDecode(context.Request["q"].ToString(), UTF8Encoding.UTF8);
前台實例
$(function() {
$("#ctl00_ContentPlaceHolder2_TextBoxen").autocomplete("../getemployee.ashx", {
delay: 5,
matchCase: false,
selectFirst: true,
cacheLength: 3,
matchSubset:false,
minChars: 0, //最少輸入字條
max: 12,
autoFill: false, //是否選多個,用","分開
mustMatch: false, //是否全匹配, 如數據中沒有此數據,將無法輸入
matchContains: true, //是否全文搜索,否則只是前面作為標准
scrollHeight: 220,
width: 500,
multiple: false,
parse: function(data) { //重寫格式化得到的json集合因為原有方法無法解析通過webservice回調的值
var rows = new Array();
var datas = data;
for (var i = 0; i < datas.length; i++) {
//alert(datas[i])
rows[i] = { data: datas[i], employeename: datas[i].employeename, unitname: datas[i].department };
}
return rows;
},
formatItem: function(row, i, max) { //顯示格式
return "<span style='width:140px'>" + row.employeename + "</span> <span style='width:120px'>" + row.department + "</span>";
},
formatMatch: function(row, i, max) { //以什么數據作為搜索關鍵詞,可包括中文,
return row.employeename;
},
formatResult: function(row) { //返回結果
return row.employeename;
}
});
$("#ctl00_ContentPlaceHolder2_TextBoxen").result(function(event, row, formatted) { //額外觸發,可不要
$("#ctl00_ContentPlaceHolder2_TextBoxen").val(row.employeename);
$("#ctl00_ContentPlaceHolder2_TextBoxeid").val(row.employeeid);
$("#ctl00_ContentPlaceHolder2_TextBox1").val(row.cardnum);
$("#ctl00_ContentPlaceHolder2_TextBoxdepart").val(row.department);
$("#ctl00_ContentPlaceHolder2_TextBoxL").val(row.carnum);
$("#ctl00_ContentPlaceHolder2_TextBoxDriver").val(row.cardriver);
$("#ctl00_ContentPlaceHolder2_TextBoxunit").val(row.unit.split('/')[2]);
if (row.carnum.length != 0 || row.cardriver.length != 0) {
$("#ctl00_ContentPlaceHolder2_CheckBoxCar").attr("checked", "checked");
}
$("#ctl00_ContentPlaceHolder2_CheckBoxPeople").attr("checked", "checked");
//更多操作
});
})