TagManager playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/max-favilli/tagmanager/master/tagmanager.css">
<script src="https://rawgithub.com/max-favilli/tagmanager/master/tagmanager.js"></script>
<script src="https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script>
<h2>Tags</h2>
<input type="text" name="tags" placeholder="new tag" class="tm-input"/>

CSS

body {
    padding: 10px;
}

.tm-tag {
    background-color: #6cc;
    color: #fff;
    padding: 0.25em 0.5em;
}
.tm-tag-remove {
    padding-left: 0.25em;
}
.tm-input {
    width: 6em;
}

JavaScript

var country_list = ["Afghanistan","Albania","Algeria","Andorra","Angola","Anguilla","Antigua &amp; Barbuda","Argentina","Armenia","Aruba","Australia","Austria","Azerbaijan","Bahamas","Bahrain","Bangladesh","Barbados","Belarus","Belgium","Belize","Benin","Bermuda","Bhutan","Bolivia","Bosnia &amp; Herzegovina","Botswana","Brazil","British Virgin Islands","Brunei","Bulgaria","Burkina Faso","Burundi","Cambodia","Cameroon","Cape Verde","Cayman Islands","Chad","Chile","China","Colombia","Congo","Cook Islands","Costa Rica","Cote D Ivoire","Croatia","Cruise Ship","Cuba","Cyprus","Czech Republic","Denmark","Djibouti","Dominica","Dominican Republic","Ecuador"];
			
		  var my_Suggestion_class = new Bloodhound({
                    limit: 10,
                    datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
                    queryTokenizer: Bloodhound.tokenizers.whitespace,
                    local: $.map(country_list, function(item) {
                        //console.log(item);
                        return {value: item};
                    })
                });	
			
   		my_Suggestion_class.initialize();
 
			var tagApi = $('.tm-input').tagsManager({
				// prefilled: f_data[x]['value'],
				 CapitalizeFirstLetter: true,
			//	 tagsContainer: $('#' + f_data[x]['id'] + 'Tags')
			})
			.typeahead(null, {
			  	name: 'value',
                    displayKey: 'value',
                    source: my_Suggestion_class.ttAdapter(),
			}).on('typeahead:selected', function (e, d) {
				tagApi.tagsManager("pushTag", d.name);
			});