Ajax AutoComplete - devbridge

Question

我使用支持AJAX的DevBridge jQuery自动完成插件。

我想在此结果中添加一个链接，供用户转到该页面。

var teams =  [
              { value: 'Chicago Blackhawks', link :'http://aaaaa.com', data: { category: 'NHL' } },
              { value: 'kk qdqsd', link :'http://sdfsdfsd.com', data: { category: 'NHL' } },
              { value: 'Chicago Bulls', link :'http://sfsdfsdfsdf.com',  data: { category: 'NBA' } }
            ]
    $('#autocomplete-ajax').autocomplete({
        lookup: teams,
        groupBy: 'category',
        transformResult: function(response) {
        return {
            suggestions: $.map(response.teams, function(dataItem) {
                return { value: dataItem.valueField, link:dataItem.valueField , data: dataItem.dataField };
            })
        };
       },
        onSelect: function(suggestion) {
            $('#selction-ajax').html('You selected:' + suggestion.value + ', ' + suggestion.data + ' '+ suggestion.link);
        },
       onHint: function (hint) {      // previ
            $('#autocomplete-ajax-x').val(hint);
        },
        onInvalidateSelection: function() {
            $('#selction-ajax').html('You selected: none');
        }
    });

我无法在结果中添加链接。

您可以在此处显示我的测试：https://jsfiddle.net/gpthdsgq/

Answer 1

这是一个非常古老的问题，但你是否正在寻找这样的东西：

$(function () {
'use strict';

var teams =  [
          { value: 'Chicago Blackhawks', data: { category: 'NHL', link: 'http://aaaaa.com' } },
          { value: 'kk qdqsd', data: { category: 'NHL', link: 'http://sdfsdfsd.com' } },
          { value: 'Chicago Bulls',  data: { category: 'NBA', link: 'http://sfsdfsdfsdf.com' } }
        ]
$('#autocomplete-ajax').autocomplete({
    lookup: teams,
    groupBy: 'category',
    transformResult: function(response) {
    return {
        suggestions: $.map(response.teams, function(dataItem) {
            return { value: dataItem.data.link, data: dataItem.value };
        })
    };
   },
    onSelect: function(suggestion) {
        $('#selction-ajax').html('You selected: <a href="' + suggestion.data.link + '">' + suggestion.data.category + ' '+ suggestion.value + '</a>');
     },
     onHint: function (hint) {      // previ
        $('#autocomplete-ajax-x').val(hint);
      },
      onInvalidateSelection: function() {
        $('#selction-ajax').html('You selected: none');
      }
   });


});