CODEWITHSUNDEEP
angularjsangular-ui-bootstrapbootstrap-typeahead
Jason
Jason

Reputation: 1817

angular bootstrap typeahead doesn't respond to clicks or arrow keys

I have a strange problem that I can't seem to replicate in jsfiddle. I have a simple typeahead (I used the states example on the bootstrap website). All works great, except the arrow keys don't let me navigate through the dropdown list, and clicking on an item doesn't select it (i.e., doesn't populate it in the textbox).

I thought it might be my css somewhere else, so I've commented out all css, still no luck.

Can anyone give me a steer on where to look? Any theories on what could possibly be wrong?

I'd post some code, but I literally pasted the example in my code (http://angular-ui.github.io/bootstrap/#/typeahead)

Upvotes: 2

Views: 1931

Answers (2)

Marius Balčytis
Marius Balčytis

Reputation: 2651

Here is the fix, which of this moment is not yet merged: https://github.com/angular-ui/bootstrap/pull/2557/files

So fix would be to include the following code anywhere after loading the angular-bootstrap-ui:

angular.module("template/typeahead/typeahead-popup.html", []).run(["$templateCache", function($templateCache) {
    $templateCache.put("template/typeahead/typeahead-popup.html",
        "<ul class=\"dropdown-menu\" ng-show=\"isOpen()\" ng-style=\"{top: position.top+'px', left: position.left+'px'}\" style=\"display: block;\" role=\"listbox\" aria-hidden=\"{{!isOpen()}}\">\n" +
        "    <li ng-repeat=\"match in matches track by $index\" ng-class=\"{active: isActive($index) }\" ng-mouseenter=\"selectActive($index)\" ng-click=\"selectMatch($index)\" role=\"option\" id=\"{{match.id}}\">\n" +
        "        <div typeahead-match index=\"$index\" match=\"match\" query=\"query\" template-url=\"templateUrl\"></div>\n" +
        "    </li>\n" +
        "</ul>");
}]);

Upvotes: 4

Jason
Jason

Reputation: 1817

Apparently there are known issues with bootstrap and angular 1.3. See https://github.com/angular-ui/bootstrap/issues/2293

Using angular version 1.2.21 solved it.

Posting answer here in case anyone else tore their hair out...

Upvotes: 1

Related Questions