IndexTank自动完成:为返回的每个结果修改自动完成字段文本

Question

我在Heroku上部署了一个Ruby/Sinatra应用程序，我正在使用IndexTank插件来提供全文搜索功能。

我目前使用的是开箱即用的自动完成功能，如IndexTank自动完成文档所示

目前，我已经对文档进行了索引，使default :text字段包含文档的城市名称和国家名称。ie：

@index.document("1").add({:text => "London England"})

当我在默认的自动完成字段中进行搜索时，它实际上会工作并返回一个结果，但这不是我所期望的，也不是我所喜欢的。

当我在字段中输入'lon‘时，它会返回'london’。这的确是正确的文件，但我希望它真的能把“，London，England，”还给我。

有谁知道我如何修改自动完成字段下拉列表中呈现的数据，以便在搜索‘’时显示‘London England’？

更新

我也尝试了注释中所建议的InstantLinks功能，但这也不完全是，，做我需要做的事情。这两种解决方案似乎都能满足我所需的80%，但不幸的是，我需要额外的东西。

关于InstantLinks，我需要做的两件事是：

• 虽然可以从下拉列表中的索引中选择要显示的字段(这是我无法使用自动完成功能完成的)，但当我使用箭头键选择下拉列表中的选项时，所选的选项不会显示在文本字段中。
• 当我从下拉列表中选择一个条目时，我会被带到另一个页面，该页面的URL应该是从索引中提取出来的。我想要做的就是选择要填充到原始文本字段中的条目的值。

因此，不幸的是，我看不出InstantLinks将如何为我提供我所追求的功能。

Answer 1

好的，所以我终于想出了解决我的问题的方法，但是，我不能使用IndexTank提供的自动完成功能或IndexTank功能。

简而言之，我所做的是使用开箱即用的jQuery自动完成小部件(我知道IndexTank自动完成在封面下使用它)来调用我创建的查询IndexTank索引的restful服务。

首先，我在Sinatra应用程序中创建了restful服务。

get '/index/' do
    term = params['term']

    #Query IndexTank index using the IndexTank::Client

    #Parse index search results and return an array of the suggestions as JSON
end

接下来，我使用jQuery自动完成小部件将restful服务用作远程源。首先是我的HTML输入：

<form id="search_form" action="/" method="POST">
    <input id="search_field" name="search_field" type="text">
</form>

然后，将自动完成部件绑定到输入的javascript：

$(document).ready(function(){
    $("#search_field").autocomplete({
      source: function(request, response) {
        $.ajax({
          url: "/index/",
          dataType: 'json',
          data: { term: request.term },
          success: function(data) {
            response($.map(data, function(item) {
              return {label: __highlight(item, request.term),
                value: item};
            }));
          }
        });
      },
      minLength: 2
    })
    .data( "autocomplete" )._renderItem = function( ul, item ) {
      // only change here was to replace .text() with .html()
      return $( "<li></li>" )
        .data( "item.autocomplete", item )
        .append( $( "<a></a>" ).html(item.label) )
        .appendTo( ul );
    };
  });

  function __highlight(s, t) {
    var matcher = new RegExp("("+$.ui.autocomplete.escapeRegex(t)+")", "ig" );
    return s.replace(matcher, "<strong>$1</strong>");
  }

这里有一个自动完成字段，它查询IndexTank索引，并在建议中显示所需的索引字段。

Answer 2

您可能希望使用InstantLinks代替。

如果您确实想要调整自动完成，则应该更改与关联的_renderItem UI小部件的jQuery属性。

$("#query").data("autocomplete")._renderItem = function(ul, item) { .. }

有关示例，请参见jQuery UI自动完成文档。