Skip to content

Instantly share code, notes, and snippets.

@gnepud
Created July 23, 2015 10:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save gnepud/c302049b5d38da92f35e to your computer and use it in GitHub Desktop.
Save gnepud/c302049b5d38da92f35e to your computer and use it in GitHub Desktop.
select2 3.5.2 + twitter Bloodhound
$(document).ready(function () {
var engine = new Bloodhound({
local: [
'Andorra',
'Unitéd Arab Emirates',
'Antarctica'
],
datumTokenizer: Bloodhound.tokenizers.whitespace,
queryTokenizer: Bloodhound.tokenizers.whitespace,
});
engine.initialize();
var target = ".srchtarget-CTRYID";
$(target).select2({
placeholder: "select a country",
quietMillis:300,
query: function (query) {
engine.search(query.term, function(resultArr){
var r = [];
for(var i in resultArr){
r.push({id: i, text: resultArr[i]});
}
query.callback({results: r});
});
}
});
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/3.5.2/select2.js"></script>
</head>
<body>
<input data-placeholder="Select Country" class="srchtarget-CTRYID" id="header-CTRYID" name="header[CTRYID]" data-label="Country" type="text"/>
</div>
</div>
</body>
</html>
@vishwapriyanatha
Copy link

not working in my local

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment