List Dont Append even tought finds the result

[mrelliot69]

Im using this lib, and when searching using the async first takes some time to load since is pending the request finishes, any ideia how to improve this? since when i type bananas, some calls are made but because they are using aync even if the finnal call have results they dont get appended.

Also in some queries the endpoint returns an array with results, but the input dont show them on the list.

0: {value: 'Rua Adelina Lessa dos Santos , 46100-970 Brumado\r\n', data: Array(2)} 1: {value: 'Rua Presidente Castelo Branco , 46100-970 Brumado\r\n', data: Array(2)} }

code im using

` var autoCompleteJS = new autoComplete({
selector: "#" + autoCompleteId,
placeHolder: "Search for Fruits...",
threshold: 4,
data: {
src: async (query) => {
if (query === "") {
return;
}

                    try {
                        // Fetch Data from external Source
                        const source = await fetch(`endpoint?search=${query}`);
                        // Data should be an array of `Objects` or `Strings`
                        const response = await source.json();
                        console.log(response)
                        return response.data;
                    } catch (error) { console.log(error)
                        return error;
                    }
                },
                // Data source 'Object' key to be searched
                keys: ["value"],
            },
            resultsList: {
                element: function element(list, data) {
                    if (!data.results.length) {
                        // Create "No Results" message element
                        var message = document.createElement("div");
                        // Add class to the created element
                        message.setAttribute("class", "no_result");
                        // Add message text content
                        message.innerHTML = "<span>Found No Results for \"" + data.query + "\"</span>";
                        // Append message element to the results list
                        list.prepend(message);
                    }
                },
                noResults: true
            },
            resultItem: {
                highlight: true
            },
            events: {
                input: {
                    selection: function selection(event) {
                        var selection = event.detail.selection.value;
                        autoCompleteJS.input.value = selection;
                    }
                }
            }
        });

`

Any ideia if its possible to use ajax insted of async method and awaits

[gdarko]

Hey @mrelliot69 ,

If anyone encounters this issue it means that even if results are found through the http/ajax call, they are still filtered.

To disable this functionality when, just specify when initializing the plugin.

searchEngine: function(query, record) {
    return 1
}

I spent so much and was shocked when i found this, basically the plugin is not usable if you are using ajax and rely on the default configuration.

Hope somebody finds this useful.