I use the same plug-in in a project
the problem with the typeahead source it need to be a json with simple elements no objects
Take a look at this fiddle, Im sure It will help you
Fiddle
$('input').tagsinput({
typeahead: {
source: function (query, process) {
cities = [];
map = {};
var data = [{
"value": 1,
"text": "Amsterdam"
}, {
"value": 4,
"text": "Washington"
}, {
"value": 7,
"text": "Sydney"
}, {
"value": 10,
"text": "Beijing"
}, {
"value": 13,
"text": "Cairo"
}];
$.each(data, function (i, city) {
map[city.text] = city;
cities.push(city.text);
});
return (cities);
}
}
});
PreFetched Json
cities = [];
map = {};
var preFetchResult = function (query, callback) {
$.get("/cities", {
"data": query
}, function (data) {
$.each(data, function (i, city) {
map[city.text] = city;
cities.push(city.text);
});
});
};
preFetchResult.done(function (response) {
$('input').tagsinput({
typeahead: {
source: function (query, process) {
return (cities);
}
}
});
});