Geek asks and answers

Bootstrap Typeahead only displays the first letter

I find it very difficult to get Twitter Bootstrap Typeahead to work. Typeahead matches only the first letter of the input. My results in the typeahead field look something like this:

n
n
n
N
N
n.

My code

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

Can anyone help?

+5
source share
4 answers

Check the combination of quotes that appear in your html for the data source attribute. I had the same problem with the following code snippet.

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

switching to the next one that I saw in other examples did not fix it

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

but switching to single quotes around the attribute value and double quotes for search items fixed by it. It works .

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

, - (.. ajax ):

:

process(JSON.parse(data));

:

process(data);
+6

, . , , , , :

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

, , . , , , JSON, typeahead, . , :

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

26 , typeahead .

, ajax-, dataType "json". , , , !

+2
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();

+1

More articles:


All Articles