例如
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
var availableTags = [ "ActionScript", "AppleScript", "Asp"];
var availableTagsCode = ["1", "2", "3"];
$( "#tags" ).autocomplete({ source: availableTags });
});
</script>
<input id="tags" name="name">
<input id="tags_code" name="code">
实际上,我尝试使用以下代码选择建议时更改代码:
$("#tags_code").val(availableTagsCode);
如果我要从0
代码分配给0
文本框的标记中选择name="code"
数组,我需要选择建议测试。
请帮我解决这个问题。
答案 0 :(得分:4)
设置 select
事件处理程序
$(function() {
var availableTags = ["ActionScript", "AppleScript", "Asp"];
var availableTagsCode = ["1", "2", "3"];
$("#tags").autocomplete({
source: availableTags,
select: function(e, ui) {
$('#tags_code').val(availableTagsCode[availableTags.indexOf(ui.item.value)]);
}
});
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<input id="tags" name="name">
<input id="tags_code" name="code">
答案 1 :(得分:2)
您可以定义select
事件处理程序:
$( "#tags" ).autocomplete({
source: availableTags,
select: function(event, ui) {
var index = availableTags.indexOf(ui.item.value);
$("#tags_code").val(availableTagsCode[index]);
}
});
实际上,当您提供value
时,jQuery UI允许您使用具有label
和source
属性的对象数组。
所以,这样的事情会起作用并且看起来更好:
var tags = [
{"label": "ActionScript", "value": 1},
{"label": "AppleScript", "value": 2},
{"label": "Asp", "value": 3}
];
$( "#tags" ).autocomplete({
source: tags,
select: function (event, ui) {
$("#tags_code").val(ui.item.value);
}
});
JSFiddle demo for the second approach
如果您不希望在选择后替换值,则可以使用自定义属性而不是value
:
var tags = [
{"label": "ActionScript", "code": 1},
{"label": "AppleScript", "code": 2},
{"label": "Asp", "code": 3}
];
$( "#tags" ).autocomplete({
source: tags,
select: function (event, ui) {
$("#tags_code").val(ui.item.code);
}
});
答案 2 :(得分:0)
<script type="text/javascript">
$(document).ready(function () {
$("#textBoxID").autocomplete({
source: function (request, responce) {
$.ajax({
url: "webservice_Name.asmx/webservice_functionName",
method: "post",
contentType: "application/json;charset=utf-8",
data: JSON.stringify({ parameterName: request.term }),
dataType: 'json',
success: function (data) {
responce(data.d);
if (data.d.length > 0)
$('#spnError').text("");
else
$('#spnError').text("Not Matching Any Result");
console.log(data.d.length);
},
error: function (err) {
alert(err);
}
});
},
minLength: 2,
select: function (event, ui) {
console.log("You selected: " + ui.item.label);
$.ajax({
url: "webservice_Name.asmx/webservice_functionNameForgetID",
method: "post",
contentType: "application/json;charset=utf-8",
data: JSON.stringify({ parameterName: ui.item.label }),
dataType: 'json',
success: function (data) {
console.log(data.d);
},
error: function (err) {
alert(err);
}
});
}
});
});
</script>