我使用的引导预输入与AJAX功能,想知道什么是正确的JSON结果格式,返回一个ID和一个descripcion。 我需要的ID给预输入所选元素具有MVC3模型绑定。
这是代码:
[Html]
<input id="myTypeahead" class='ajax-typeahead' type="text" data-link="myUrl" data-provide="typeahead" />
[Javascript]
$('#myTypeahead').typeahead({
source: function (query, process) {
return $.ajax({
url: $('#myTypeahead').data('link'),
type: 'post',
data: { query: query },
dataType: 'json',
success: function (jsonResult) {
return typeof jsonResult == 'undefined' ? false : process(jsonResult);
}
});
}
});
This works properly when I return a simple list of strings, for example:
{item1, item2, item3}
But I want to return a list with Id, for example:
{
{Id: 1, value: item1},
{Id: 2, value: item2},
{Id: 3, value: item3}
}
如何处理这个结果在Ajax“的成功:)功能(”?
这是很容易使用jQuery自动完成的,因为我可以返回一个JSON对象列表。
[jquery Autocomplete process data example]
...
success: function (data) {
response($.map(data, function (item) {
return { label: item.Id, value: item.Value, id: item.Id, data: item };
})
...
但是,这并不具有自举工作,事先键入的内容。
谁能帮我?
谢谢。
我尝试了两天,最后我可能工作。 自举事先键入的内容不支持对象的数组作为默认,只有串的阵列的结果。 因为“匹配”,“分拣”,“更新”和“荧光笔”的功能期待字符串作为参数。
取而代之的是,“引导”支持可定制的“匹配”,“分拣”,“更新”和“荧光笔”功能。 因此,我们可以重写选项事先键入的内容与功能。
II使用JSON格式,并绑定ID以一个隐藏的HTML输入。
代码:
$('#myTypeahead').typeahead({
source: function (query, process) {
return $.ajax({
url: $('#myTypeahead').data('link'),
type: 'post',
data: { query: query },
dataType: 'json',
success: function (result) {
var resultList = result.map(function (item) {
var aItem = { id: item.Id, name: item.Name };
return JSON.stringify(aItem);
});
return process(resultList);
}
});
},
matcher: function (obj) {
var item = JSON.parse(obj);
return ~item.name.toLowerCase().indexOf(this.query.toLowerCase())
},
sorter: function (items) {
var beginswith = [], caseSensitive = [], caseInsensitive = [], item;
while (aItem = items.shift()) {
var item = JSON.parse(aItem);
if (!item.name.toLowerCase().indexOf(this.query.toLowerCase())) beginswith.push(JSON.stringify(item));
else if (~item.name.indexOf(this.query)) caseSensitive.push(JSON.stringify(item));
else caseInsensitive.push(JSON.stringify(item));
}
return beginswith.concat(caseSensitive, caseInsensitive)
},
highlighter: function (obj) {
var item = JSON.parse(obj);
var query = this.query.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, '\\$&')
return item.name.replace(new RegExp('(' + query + ')', 'ig'), function ($1, match) {
return '<strong>' + match + '</strong>'
})
},
updater: function (obj) {
var item = JSON.parse(obj);
$('#IdControl').attr('value', item.id);
return item.name;
}
});
注:我看到@ EralpB`s评论“这仍然是完成这一任务的最好方法是什么?”
是的,@Gonzalo解决方案的工作,但它似乎很奇怪(如拐杖,尤其是在使用jQuery的自动完成后) -它应该工作“从盒子” .Better就是用这种- 引导-3-事先键入的内容 。 它支持对象的数组作为结果:格式- [{ID:.., 名称 :...},...,{ID:.., 名称 :...}]。 举例OP`s问题:
....
source: function (query, process) {
return $.ajax({
......
success: function (result) {
var resultList = [];
$.map(result,function (Id,value) {
var aItem = { id: Id, name: value};
resultList.push(aItem);
});
return process(resultList);
}
});
},