使用 SODA 数据源引导预输入

Question

我正在尝试使用 bootstrap typahead，并使用 SODA 端点作为数据源。 SODA 端点返回一个 JSON 数组，并且可以使用简单的查询字符串来查询它。

端点示例： https://soda.demo.socrata.com/resource/earthquakes.json?region=Washington 取自：http://dev.socrata.com/consumers/getting-started/

在这种情况下，Washington 是用户可能在输入中键入的内容。

以Washington 为例返回的 JSON 示例： [ { "region" : "Washington", "source" : "uw", "location" : { "needs_recoding" : false, "longitude" : "-120.0137", "latitude" : "47.3452" }, "magnitude" : "3.3", "number_of_stations" : "38", "datetime" : "2012-09-13T17:33:45", "earthquake_id" : "60451342", "depth" : "12.70", "version" : "1" } , { "region" : "Washington", "source" : "uw", "location" : { "needs_recoding" : false, "longitude" : "-122.4432", "latitude" : "46.5543" }, "magnitude" : "1.1", "number_of_stations" : "31", "datetime" : "2012-09-13T11:52:57", "earthquake_id" : "60451197", "depth" : "16.60", "version" : "2" } ]

如果 JSON 的格式很奇怪，请见谅。

到目前为止，我一直无法让 typeahead 工作，也找不到足够的文档来说明如何检索此类数据。

Answer 1

如果你想在用户选择选项时调用url，你可以使用updater

$("#sourceInput").typeahead({
   source:function(query,process){
      var url = 'https://soda.demo.socrata.com/resource/earthquakes.json?region=' + query;
      $.getJSON(url,function(resp){
        process(resp)
      });
   },
   updater: function(item){
      var url = 'https://soda.demo.socrata.com/resource/earthquakes.json?region=' + item;
      $.getJSON(url,function(resp){
        //do something with json response
      });
      //return the item for the input
      return item;
   }
});