jquery autocomplete中,我是使用一个hidden value来记忆当用户在auotocomplete中输入的内容的对应ID值,比如用户输入:
a,b,c,d,则通过ajax從后端 取出aid,bid,cid,did,放到hidden value中,
result(function(event, item, formatted) {
str=str+formatted+","
$("#hiddenvalue").attr("value",str);
}
但这个有个问题,比如用户觉得要取消d的话,重新输入一个e,
则auotocomplete框中变成了a,b,c,d,但hidden value中,
依然是a,b,c,d,e了,
又比如用户删除了a,b,c,d,输入了一个f,则hidden value依然是a,b,c,d
,
问题是有什么办法,可以让hidden value中的值,动态跟着auotocomple用户选择的值变化呢?
jquery autocomplete 有好几个不同的版本。
建议你使用 jqueryUI 里面的 http://jqueryui.com/demos/autocomplete/#remote-jsonp
里面有很多例子
特别上面的Examples
点击 View Source 里面的代码更值得参考
这里再给你一个例子:
var autocompleteParser = function (results) {
var parsed=[];
if (results != null) {
var addedItems = 0;
$.map(results["list"], function(item, index) {
parsed[addedItems]= {
id : item.studentId,
label : item.showName,
value : item.showName
};
addedItems++;
});
}
return parsed;
},
getStudentList : function (request, response ) {
var term = request.term;
var jsonData= csRpcClient.findContactData(term);
response(studentQuickSearch.autocompleteParser(jsonData));
},
initAutocomplete: function (){
var btnObj =$(".jq-autocomplete-btn");
$( ".jq-autocomplete-input" ).autocomplete({
delay : 600,
source : studentQuickSearch.getStudentList,
minLength : 3,
select : function( event, ui ) {
if(ui.item){
btnObj.attr("sId",ui.item.id);
btnObj.attr("sName",ui.item.value);
}
}
});
}
ui.item 里面有要的东西
不需要额外的东西
我没有明确的看明白你问的问题, 你的的值 是你输入的还是选择的选项。
autocomplete 的source: 根据你的输入 返回可选项
function( request, response ) {
var yourInput = request.term;
var str = $("#hiddenvalue").val("value")
str=str+","+ yourInput;
$("#hiddenvalue").val(str); //这样,hiddenvalue里面就是你输入的历史,不过没有太大的意义
response ([
{
id : 1,
value : Item1
},
{
id : 2,
value : Item2
}
])
}
request.term 就是你输入的东西
response的参数 是 数组[], 是你得到的选择列表。
autocomplete 的select: 是你选择了一个选项后的处理函数
function( event, ui ) {
$("#hiddenvalueId").val(ui.item.id);
$("#hiddenvalueValue").val(ui.item.value);
}
上面的代码执行后hiddenvalueId中将是 被选中的 ID,hiddenvalueValue中将是 被选中的 value
ui.item中有 id, value 是因为response 中的参数有这两个东西