Bootstrap Typeahead仅显示第一个字母

时间:2012-08-29 23:16:24

标签: ruby-on-rails twitter-bootstrap datasource typeahead

我很难让Twitter Bootstrap的Typeahead工作。 Typeahead仅匹配输入的第一个字母。我在预先输入框中的结果类似于

n
n
n
N
N
n.

我的代码是

<%= text_field_tag :search, params[:search], "data-provide" => "typeahead", "data-source" => '["USA", "Canada","Mexico"]' %>

有人可以帮忙吗?

4 个答案:

答案 0 :(得分:7)

检查html中为数据源属性输出的引号组合。我在使用以下代码片段时遇到了同样的问题。

<input type="text" name="test" id="test" class="span2" data-provide="typeahead" 
data-items="4" data-source="['thisone','another','zzzz']">

更改为以下内容,我在其他示例中看到过,没有修复它

data-source="["thisone","another","zzzz"]"

但切换到属性值周围的单引号和可搜索元素的双引号修复它。 此作品

data-source='["thisone","another","zzzz"]'

答案 1 :(得分:6)

对于在使用源函数时遇到此问题的任何人(即对服务器的ajax调用):

使用:

process(JSON.parse(data));

而不是:

process(data);

答案 2 :(得分:2)

我刚试过你的代码,它对我有用。当我把引号改为这样的时候,我得到了你所遇到的问题:

"['USA', 'Canada','Mexico']"

我遇到了类似的问题,它与您的问题略有不同,但它可能对其他人有所帮助。发生在我身上的是我传递给typeahead的JSON被解释为一个字符数组。所以如果我通过了:

["USA", "Canada","Mexico"]

它将它解释为一个包含26个字符的数组,因此typeahead的结果是给我单个字符。

在我的情况下,这是因为我正在进行ajax调用而我没有将dataType设置为'json'。在你的情况下,这不是问题,但希望这会让你走向解决方案!

答案 3 :(得分:1)

var data = "";
$.ajax({
        url: 'ajax/getdirverandpass.php',
        success: function (result) {
            data = JSON.parse(result);
        },
        async: false
});

 $("#nav-search-input").typeahead({source: data, updater: function (a) {
            $("#nav-search-input").focus();
            return a
}});

请使用此 JSON.parse(结果);