Twitter Bootstrap使用JSON提前输入 [英] Twitter Bootstrap typeahead with JSON

问题描述

如何将Twitter Bootstrap Typeahead与JSON结合使用.我的Bootstrap版本是 2.2.1

How can i use Twitter Bootstrap Typeahead with JSON. My Bootstrap version is 2.2.1

我的JSON响应

   [{"label":"Sistemski Administrator","value":"1"},{"label":"Jure Hotujec","value":"3"},{"label":" ","value":"4"},{"label":"Simona Jamnik","value":"5"},{"label":"Ma\u0161a Mu\u0161i\u010d","value":"6"},{"label":" ","value":"7"}]

我现在所拥有的就是这个，但是源必须是数组，在我的情况下，它是JSON

All i've got now is this, but the source must be array and in my case it's JSON

$("#typeahead").autocomplete({
    soruce : soruce
});

如果这有任何改变，我也想将其与模式元素一起使用.

Also i would like to use it with modal element, if that changes anything.

谢谢！

推荐答案

使用jQuery的parseJson方法，然后将其传递给typeahead的source参数.

Use jQuery's parseJson method, then pass it in to typeahead's source parameter.

var jsonString =  '[{"label":"Sistemski Administrator","value":"1"},{"label":"Jure Hotujec","value":"3"},{"label":" ","value":"4"},{"label":"Simona Jamnik","value":"5"},{"label":"Ma\u0161a Mu\u0161i\u010d","value":"6"},{"label":" ","value":"7"}]';
var jsonObj = $.parseJSON(jsonString);
var sourceArr = [];

for (var i=0; i<jsonObj.length; i++) {
  sourceArr.push(jsonObj[i].label);
}

$("#typeahead").typeahead({
    source : sourceArr
});

这是一个 jsfiddle示例.
有关更多信息，请查看键入文档.

Here's a jsfiddle example.
For more info, check out the typeahead docs.

这篇关于Twitter Bootstrap使用JSON提前输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！