Autocomplete and Snippet Widget

Good evening,
I managed to implement the snippet widget with instantsearch.

Unfortunately i was not able implement snippets for algolia autocomplete.

it’s possible to do it?

This is my current code:

var a = algoliasearch("*********", "*****************").initIndex("my_index")
autocomplete(".my_div", {
    hint: !1
}, {
    source: autocomplete.sources.hits(a, {
        hitsPerPage: 10
    }),
    displayKey: "",
    templates: {
        suggestion: function(a) {
            return "<article><a href='/" + a.slug + "/'>" + a._highlightResult.plaintext.value + "</a></article>"
        }
    }
})

Hi @giacomosilli,

Unfortunately the snippet functionality is not built into the autocomplete.js library.

You could attempt to use our “autocomplete using InstantSearch” guide and implement snippeting here: https://www.algolia.com/doc/guides/building-search-ui/resources/ui-and-ux-patterns/in-depth/autocomplete/js/#overview

Thanks I found this solution but I want to show the snippets INSIDE the droppdown menu, not in the page below. it’s possible?

Hi @giacomosilli,

As Ajay mentioned, this is not something built in to the Autocomplete, you could possibly make this work by customizing the Autocomplete.

Ok I managed to implement the snippets.

Now by clicking on the result in the dropdown menu, instead of redirecting, takes the set value and writes it to the input.

Currently to redirect I am doing this:

        onSelectChange(value) {
            event.preventDefault();
            var href = $(this).attr('href')
            window.location='http://domain.com/' + value.query;
        },

Is there a better way?
Thanks
I love algolia :slight_smile: