Text Autocomplete Control

Microsoft delivers firstparty text autocomplete control. As a datasource it can use either entity view or labels of picklist. But what if there is a need to have more flexibility. This control gives you more flexibility and control over the list of values available for the autocomplete.

Basic Usage Instructions

You have to create the JS webresource with the function that accepts text string and returns promise with an array of strings that are shown as autocomplete list before configurating the control. Here is an example of such function:

function getAutocompleteItems(searchText){
    !searchText && searchText = "";

    var fruits = ["apple", "orange", "lemon", "peach"];

    return new Promise(function(resolve, reject) {
        if (searchText === "") {
            resolve([]);
            return;
        }

        var result = fruits.filter(function(fruit){
            return (fruit.toLowerCase().indexOf(searchText.toLowerCase()) !== -1);
        });
        
        resolve(result.slice(0, 10));
    });
}

Once the code is written, deployed to the CDS as a webresource and published, control can be configured. Configure control the way shown in the following animated image:

Save and publish the form.