bootstrap typehead转换为ajax

Question

我有一个包含硬编码数据的工作样本。我正在尝试使用bootstrap-typehead将其转换为ajax调用。我不确定我做错了什么，但consol正在大错特错。有人能帮上忙吗？谢谢!

//错误

日志: object Object，object object SCRIPT438: object不支持属性或方法'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

它现在起作用了。

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

我认为这是因为你使用的是ajax，但是javascript有asyn (默认)，所以你可以试着这样使用ajax来设置async: false。Hpe此帮助。

​

$('#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);
    }
});

​