Twitter Bootstrap Typeahead

by Sherbrow

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
<input type="text" class="typeahead" id="myTypeahead" /><br />
<button class="btn" id="myBtn">New Source</button>

CSS

body { padding: 40px; }

JavaScript

var 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 Dakota","North Carolina","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"];

$('#myBtn').on('click', function() {
    var source = newSource();
    var typeahead = $('#myTypeahead').data('typeahead');
    if (typeahead) typeahead.source = source;
    else $('#myTypeahead').typeahead({source: source});
});

var count = 1;
function newSource() {
    var copy = [];
    for(var i in source) {
        copy[i] = source[i] + count;
    }
    ++count;
    return copy;
}