2

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

我目前正在根据IndexTank 自动完成文档使用开箱即用的自动完成功能

目前我已经为我的文档编制了索引，以便默认的 :text 字段包含文档的城市名称和国家名称。IE：

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

当我在默认的自动完成字段中进行搜索时，它实际上确实有效并返回了结果，但不是我所期望或喜欢的。

当我在字段中输入“ lon ”时，它会返回“ london ”。这确实是正确的文件，但我希望它实际上会返回我“伦敦英格兰”。

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

更新

我还尝试了评论中建议的InstantLinks功能，但这也不能完全满足我的需要。似乎这两种解决方案都完成了我需要的大约 80% 的工作，但不幸的是我需要一些额外的东西。

InstantLinks 不能按我需要的两件事是：

  • 虽然我可以从索引中选择要在下拉列表中显示的字段（这是我无法使用自动完成功能所做的），但当我使用箭头键选择下拉列表中的选项时，所选选项不会显示在文本字段中。

  • 当我从下拉列表中选择一个条目时，我被带到另一个页面，该页面的 URL 应该是从索引中提取的。我想要发生的只是选择要填充到原始文本字段中的条目的值。

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

4

2 回答 2

1

好的，所以我终于找到了解决问题的方法，但是，我无法使用 IndexTank 提供的 Autocomplete 或 InstantLinks 功能。

简而言之，我所做的是使用开箱即用的 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 索引并在建议下拉列表中显示所需索引字段的自动完成字段。

于 2011-08-10T14:14:51.123 回答
0

您可能想改用InstantLinks。

如果你真的想调整自动完成，你应该改变与 Indextank 自动完成关联的 jQuery UI 小部件的 _renderItem 属性。

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

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

于 2011-07-27T02:27:48.597 回答