Question

我正在使用twitter bootstrap 2.0.4。我想使用ajax填充下拉列表。 typeahead插件的source属性要求source的值为数组或功能。我尝试在ajax请求之后更改数组的值，但它只显示第一个请求的结果。

<form class="navbar-search">
   <input type="text" id="searchSong" class="typeahead" placeholder="Search">
</form>

 $('.typeahead').keyup(function(){                     
                var list;
                var q = $('.typeahead').val();
                if(!q){
                    return;
                }
                $.ajax({
                    type: "GET",
                    url: "/WebApplication1/Playlist/search?query="+q,
                    success: function(data){
                        list = data.split(',');
                        alert(list);
                        $('.typeahead').typeahead({
                            source: list
                        })
                    }
                });

警告框显示从ajax加载的数据是正确的，但下拉列表仍然显示以前的值

Answer 1

如果插件已在使用中，则无法重新初始化该插件。

尝试更新已在工作的预先输入：Live demo (jsfiddle)

var typeahead = $('.typeahead').data('typeahead');
if(typeahead) typeahead.source = list;
else $('.typeahead').typeahead({source: list});

Plugin code responsible (github)

Answer 2

我认为该版本不支持使用开箱即用的ajax填充typeahead。但是，有一些版本的插件支持它。

Here's one。我不记得那是否与我使用的相同，但如果是，它的效果非常好。我会肯定地发现并更新这个答案。

<强>更新

Here is a question你应该看一下。所选答案中给出的extension是我使用的答案。

Answer 3

吃这个

  $.get('/my_url/' + some_params, function(data){
    $("#address-field").typeahead().data().typeahead.source = data
  },'json');

如何在twitter bootstrap中更改typeahead的source属性？

3 个答案: