将Bootstrap 3 Typeahead与Bootstrap标记输入集成

我试图在Bootstrap-Tagsinput plugin中集成Bootstrap 3 Typeahead plugin（基本上是一个从Bootstrap 3中删除之前的Bootstrap typeahead功能的端口，如果我理解正确的话）。将Bootstrap 3 Typeahead与Bootstrap标记输入集成

我没有问题让这些工作单独工作，包括JSON预取typehead功能。我不明白如何整合这两者。我不认为它应该太难，但我对JavaScript的知识显然是缺乏的。

这里是我的输入字段：

<input type="text" id="tagFilter" data-provide="typeahead" data-role="tagsinput">

这里是预输入插件调用JavaScript的方式：

//The typeahead 
$.get('tags.php', function(data){ 
    $("#tagFilter").typeahead({ source:data }); 
    },'json');

如果它是有帮助的，Tagsinput有一个例子其doc解释如何实施twitter typeahead.js：

$('input').tagsinput(); 

// Adding custom typeahead support using http://twitter.github.io/typeahead.js 
$('input').tagsinput('input').typeahead({ 
    prefetch: 'citynames.json' 
}).bind('typeahead:selected', $.proxy(function (obj, datum) { 
    this.tagsinput('add', datum.value); 
    this.tagsinput('input').typeahead('setQuery', ''); 
}, $('input')));

但我正在使用不同的插件。我发现那个人在我的头上。

再次感谢。

来源

2014-04-03 dcclassics

好吧...所以我已经决定使用Twitter typeahead.js，因为我设法让它工作。我使用了下面的代码，请有人指出，如果这不是最好的办法。

<input type="text" id="tagFilter" data-provide="typeahead" value="test,arlington">

$('#tagFilter').tagsinput({ 
    typeahead: { 
     source: $.get('tags.php') 
    } 
    });

我tags.php文件只是一个清单，我认为这将需要大量的工作来获得这与在JSON文件键的关联数组功能。我认为这对我来说没有任何好处，因为我只关心用于查询的标签名称。

所以我tags.php只是呼应的结果：

//the mySQLi query is above... 
while ($row = mysqli_fetch_assoc($result)) { 
     $tags[] = $row['tag_name']; 

    } 
echo json_encode($tags);

希望有人能受益。

来源

2014-04-04 03:40:56 dcclassics

将Bootstrap 3 Typeahead与Bootstrap标记输入集成

回答

相关问题