<!DOCTYPE html>
<html>
<head>
<!-- GOOD ORDER -->
<!-- JQUERY -->
<script data-require="jquery@1.10.1" data-semver="1.10.1" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<!-- TPEAHEAD -->
<script src="https://rawgithub.com/bassjobsen/Bootstrap-3-Typeahead/master/bootstrap3-typeahead.js"></script>
<!-- ANGULARJS -->
<script src="https://code.angularjs.org/1.4.8/angular.js"></script>
<!-- UI-BOOTSTRAP-TPLS -->
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-1.0.3.js"></script>
<!-- ANGULAR-BOOTSTRAP-TYPEAHEAD -->
<script src="https://rawgithub.com/davidkonrad/angular-bootstrap3-typeahead/master/angular-bootstrap3-typeahead.js"></script>
<!-- BOOTSTRAP -->
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
</head>
<body>
<div ng-app="bootstrap3-typeahead-example">
<div ng-controller="sampleCtrl">
<div>
<h2>bootstrap3-typeahead example</h2>
<h4>selected value: {{ value }}</h4>
States: <input type="text" bs3-typeahead bs3-source="source" ng-model="value" />
<br />
States (from http.get): <input type="text" bs3-typeahead bs3-source="source_http" ng-model="http_value" />
</div>
</div>
</div>
<script>
(function (angular) {
'use strict';
angular.module('bootstrap3-typeahead-example', ['ui.bootstrap', 'bootstrap3-typeahead']).
controller('sampleCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.HttpTest = function () {
$http.get('https://jsonplaceholder.typicode.com/posts')
.then(
function (data) {
$scope.source_http = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];
},
function (error) {
console.log(error);
});
};
$scope.source = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'];
$scope.value = undefined;
$scope.http_value = undefined;
$scope.HttpTest();
}]);
})(angular);
</script>
</body>
</html>
// Code goes here
/* Styles go here */