javascript - 使用 json ajax javascript jquery 和 java 自动完成搜索栏(无 PHP)

Question

我正在尝试实现类似于 facebook 的自动完成搜索栏(例如单击特定结果时的下拉结果，它应该定向到相应的链接)。

我已经让自动完成功能正常工作(搜索结果仅显示文本)，但我不确定如何将相应的链接/网址链接到结果。

非常感谢任何帮助。谢谢。

下面是我的 java searchjson 方法，我已将其作为“GET”方法链接到路由。

public static Result searchJSON(String query) {
    List<Account> userAccs = searchAccounts(query);
    ObjectNode json = Json.newObject();
    ArrayNode jsonArray = json.putArray("");
    ObjectNode node = null;
    for(Account acc : userAccs) {
        node = jsonArray.addObject();
        node.put("label", acc.getDisplayName());
        node.put("id", acc.getId());
    }
    return ok(jsonArray);

下面是我的自动完成 JavaScript

var SearchBar = (function($) {
var search_data = function( request, response ) {
    $.ajax({
        url: "/search.json",
        dataType: "json",
        type: "GET",            
        data: {q: request.term },
        success: function( data ) {
            response( $.map( data, function( item ) {
                return {
                    label: item.label,
                    id: item.id
                  };
               }));
           }
       });
    };

    $("#searchfield").autocomplete({
        source: search_data,
        minLength: 1
     }); 

  return {
      attach: attach_to_bar
  };

}) (jQuery);

Answer 1

在自动完成构造函数中，您可以使用选项

选择:函数(事件，ui){}

当您选择一个项目时，它会被触发。这样您就可以做任何您喜欢的事情。

所以你谈论重定向，在这种情况下你可以使用 window.location 重定向到该页面