jquery autocomplete, comment analyser une requête json avec info url?

Question

J'utilise le plugin jquery autocomplete, mais tout ce qu'il fait, c'est afficher une liste déroulante de lignes qui, lorsqu'on clique dessus, injecte le terme dans la boîte de saisie.

Ce que je veux, c'est qu'il ait un lien hypertexte, donc quand on clique dessus, il redirige vers la page.

Est-il possible de retourner une requête json plus riche, qui a d'autres méta-données comme une URL, une image et qui serait affichée dans la boîte de saisie semi-automatique qui s'affiche?

J'ai vu cela fait sur un site, mais je ne sais pas si ils ont dû modifier le plugin de saisie semi-automatique pour que cela fonctionne? c'est-à-dire renvoyer une réponse de JSON comme s'opposant à juste une liste de texte.

Answer 1

Si vous parlez this plugin, ce qui suit devrait fonctionner:

En supposant que votre résultat JSON ressemble à quelque chose comme ceci:

[ 
    { 
    name: 'Google', 
    image: 'http://google.com/logo.png', 
    href: 'http://google.com' 
    }, 
    { 
    name: 'Bing', 
    image: 'http://bing.com/logo.png', 
    href: 'http://bing.com/' 
    } 
    ... 
] 

Vous aurez besoin de passer dans votre propre fonction d'analyse syntaxique personnalisé dans votre options Cette fonction doit retourner un tableau d'objets du format: { data: object, value: string, result: string }

$('#myfield').autocomplete('/search', { 

    parse: function(data) { 
    return $.map(data, function(item) { 
     return { data: item, value: item.name, result: item.href }; 
    }); 
    }, 

    formatItem: function(item) { 
    return '<img src="' + item.image + '"/> ' + item.name; 
    } 

}) 
.result(function(event, item) { 
    location.href = item.href; 
}); 

Il pourrait y avoir une meilleure façon de faire le lien, et je sais que je l'ai vu d'autres autocomplete/suggérer des plugins de type qui vous permettent de faire C'est plus facile mais je ne me souviens plus lesquels. J'espère que cela t'aides.