Today, I am working on typeahead with Azure Search.
I am reading, https://docs.microsoft.com/en-us/azure/search/search-autocomplete-tutorial
Before you proceed, you need to make sure you have your suggester fieldset. Per index, you can have only one suggester field.

On your page use this javascript
|
$(function () { $("#example1a").autocomplete({ source: "/home/suggest?highlights=false&fuzzy=false&", minLength: 3, position: { my: "left top", at: "left-23 bottom+10" }, classes: { "ui-autocomplete":"my-ui-autocomplete" } }); }); |
This code above uses the jQuery UI Autocomplete library. (https://jqueryui.com/autocomplete/ , see the API here http://api.jqueryui.com/autocomplete/) you can go to https://code.jquery.com/ and find CDN version to simply copy paste to the page.
Now, let’s look at HomeController.cs (or any controller that you set to be called from the javascript) and related classes to return the suggestions.
/home/suggest?highlihts=false&fuzzy=false needs to return Jason format result.
I actually keep my Azure Search management services in different classes, where I have a method to return a list of suggestions in strings like below.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
|
public List<string> GetSuggest(bool highlights, bool fuzzy, string term) { var sp = new SuggestParameters() { UseFuzzyMatching = fuzzy, Top = 5 }; if (highlights) { sp.HighlightPreTag = "<b>"; sp.HighlightPostTag = "</b>"; } var resp = _searchIndexClient.Documents.Suggest(term, "name", sp); return resp.Results.Select(x => x.Text).ToList(); } |
Then, I have home controller calling this method and return Json as below.
|
public ActionResult Suggest(bool highlights, bool fuzzy, string term) { return new JsonResult(_searchServiceProvider.GetSuggest(highlights, fuzzy, term)); } |
This is it, it works beautifully.