JSON 自动完成键值对中的字符串
JSON string in autocomplete key and value pair
我有一个 JSON 字符串
我使用 PHP 的 json_encode 检索到了 {"Name1":"ID1","Name2":"ID2"}
。
如何在自动完成选项中使用 Name1、Name2 的输入字段,并且一旦选择 Name1,ID1 将被带入隐藏字段?
我正在使用 Jquery ui 自动完成。
var NameIDJsonString = <?php echo $NameIDJsonString; ?>;
$(function () {
$('#JSONName').autocomplete({
source: function (request, response) {
response($.map(NameIDJsonString, function (value, key) {
return {
label: key,
value: value
};
}));
},
select: function (event, ui) {
$("#JSONName").val(ui.item.text); // display the selected text
$("#JSONID").val(ui.item.value); // save selected id to hidden input
}
});
});
}
<html>
<body>
<input id="JSONName" name="JSONName" size="30" class="ui-autocomplete-input" autocomplete="on" type="text" >
<input id="JSONID" name="JSONID" size="30" class="ui-autocomplete-input" autocomplete="on" type="hidden" >
var source = [ ];
var mapping = { };
for(var i = 0; i < NameIDJsonString.length; ++i) {
source.push(NameIDJsonString[i].Name);
mapping[NameIDJsonString[i].Name] = NameIDJsonString[i].ID;
}
$('#JSONName').autocomplete({
minLength: 1,
source: source,
select: function(event, ui) {
"use strict";
var summary=ui.item.value;
$("#JSONID").val(mapping[name]);
},
change: function( event, ui ) {
val = $(this).val();
exists = $.inArray(val,source);
if (exists<0) {
$(this).val("");
alert("Please enter a value from the list");
return false;
}
}
});
我已经修改了我的 JSON 字符串,因为每个对象都像
{Name:"Name1",ID:"ID1"}
{Name:"Name2",ID:"ID2"}
因此上面的代码应该有所帮助。谢谢。:)
我有一个 JSON 字符串
我使用 PHP 的 json_encode 检索到了 {"Name1":"ID1","Name2":"ID2"}
。
如何在自动完成选项中使用 Name1、Name2 的输入字段,并且一旦选择 Name1,ID1 将被带入隐藏字段?
我正在使用 Jquery ui 自动完成。
var NameIDJsonString = <?php echo $NameIDJsonString; ?>;
$(function () {
$('#JSONName').autocomplete({
source: function (request, response) {
response($.map(NameIDJsonString, function (value, key) {
return {
label: key,
value: value
};
}));
},
select: function (event, ui) {
$("#JSONName").val(ui.item.text); // display the selected text
$("#JSONID").val(ui.item.value); // save selected id to hidden input
}
});
});
}
<html>
<body>
<input id="JSONName" name="JSONName" size="30" class="ui-autocomplete-input" autocomplete="on" type="text" >
<input id="JSONID" name="JSONID" size="30" class="ui-autocomplete-input" autocomplete="on" type="hidden" >
var source = [ ];
var mapping = { };
for(var i = 0; i < NameIDJsonString.length; ++i) {
source.push(NameIDJsonString[i].Name);
mapping[NameIDJsonString[i].Name] = NameIDJsonString[i].ID;
}
$('#JSONName').autocomplete({
minLength: 1,
source: source,
select: function(event, ui) {
"use strict";
var summary=ui.item.value;
$("#JSONID").val(mapping[name]);
},
change: function( event, ui ) {
val = $(this).val();
exists = $.inArray(val,source);
if (exists<0) {
$(this).val("");
alert("Please enter a value from the list");
return false;
}
}
});
我已经修改了我的 JSON 字符串,因为每个对象都像
{Name:"Name1",ID:"ID1"}
{Name:"Name2",ID:"ID2"}
因此上面的代码应该有所帮助。谢谢。:)