【问题标题】:Bootstrap typeahead store more valuesBootstrap 预输入存储更多值
【发布时间】:2013-06-02 18:33:05
【问题描述】:

所以我有一个基本的预输入设置,我在其中搜索城市名称,但在选择时我还需要该城市的纬度和经度,以便我可以将其发送到后端。

  $('.typeahead').typeahead({
    minLength : 3,
    source : function(typeahead,query){
        return $.ajax({
        url: appUrl+"/"+query,
        dataType: 'json',
        success: function(data)
        {
          var obj = $.parseJSON(data);
          var locations = [];
          $(data).each(function(index,value){
            locations.push(value.City);
          });
          return typeahead.process(locations);
        }
      });
    },
    onselect : function(item){

      console.log(item);
    }
  });

所以我从 JSon 接收 lat 和 long 但我不知道如何将它们存储在源数组中,所以我可以在 onselect 操作中使用它们,有什么提示吗?

【问题讨论】:

    标签: javascript jquery html json twitter-bootstrap


    【解决方案1】:

    解决方案是创建另一个对象来存储数据,以便我以后可以访问它。

     var locationsData = {};
      $('.typeahead').typeahead({
        minLength : 3,
        source : function(typeahead,query){
            return $.ajax({
            url: appUrl+"/"+query,
            dataType: 'json',
            success: function(data)
            {
              var obj = $.parseJSON(data);
              var locations = [];
              $(data).each(function(index,value){
                locations.push(value.City);
                locationsData[value.City] = {'Lat' : value.Latitude, 'Long' : value.Longitude};
              });
              return typeahead.process(locations);
            }
          });
        },
        onselect : function(item){
    
          console.log(item);
          console.log(locationsData);
          console.log(locationsData[item].Lat);
        }
      });
    });
    

    【讨论】:

    • 您的解决方案肯定有效,但我会更优雅地覆盖 twitter 预输入功能:匹配器、排序器、更新器和荧光笔。更多代码 :( 但我可以编写“return typeahead.process($data)”而不需要创建不必要的数组。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-08-25
    • 2012-10-26
    • 2013-05-09
    • 2013-06-15
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多