bootstrap typehead converting to ajax - ajax

Question

I have a working sample with hardcoded data. I am trying to convert it to ajax call using bootstrap-typehead. I am not sure what I am doing wrong, but consol is shwoing error. Could some one help ? Thanks!
//Error
LOG: [object Object],[object Object],[object Object],[object Object]
SCRIPT438: Object doesn't support property or method 'toLowerCase'
JSFIDDLE
$('#selectAgent').typeahead({
source: function (query, process) {
return $.post('/eBus/EbusinessAgentServlet', { query: query }, function (data) {
console.log(data)
return process(data);
});
}
,
minLength: 2,
highlighter: formatRecord,
updater: function (item) {
$('#selectAgent').attr('data-agent-id', item.split('#')[1]);
return formatRecord(item);
}
});

Answer 1

It is working now.
var nameIdMap = {};
$('#selectAgent').typeahead({
source: function (query, process) {
return $.ajax({
dataType: "json",
url: '/eBus/EbusinessAgentServlet',
data: 'q=' + query,
type: 'POST',
success: function (json) {
console.log(json)
process(getOptionsFromJson(json));
}
});
},
minLength: 2,
updater: function (item) {
console.log('selected id'+nameIdMap[item]);
return item;
}
});
});
function getOptionsFromJson(json) {
$.each(json, function (i, v) {
nameIdMap[v.fname] = v.agentID;
});
return $.map(json, function (n, i) {
return n.fname;
});
}
function getAjaxRequestData(query) {
return {
json: getJsonData(query),
delay: 1
};
// in the question this would be:
// return 'q='+query;
}

Answer 2

I think that because you're using ajax but javascript is has asyn (default) so you can try to using ajax this way to set async: false . Hpe this help.
$('#selectAgent').typeahead({
source: function (query, process) {
return $.ajax({
url: "/eBus/EbusinessAgentServlet",
data: { query: query },
type: "POST",
async: false,
success: function (data) {
console.log(data)
return process(data);
}
});
},
minLength: 2,
highlighter: formatRecord,
updater: function (item) {
$('#selectAgent').attr('data-agent-id', item.split('#')[1]);
return formatRecord(item);
}
});