JSFiddle - React, Tailwind, and code Playground

by miroslav

HTML

<link rel="stylesheet" href="http://jquery-ui.googlecode.com/svn/tags/1.8.16/themes/smoothness/jquery.ui.all.css">
<input type="text" id="list" />

CSS

input {
    margin: 10px;
}

JavaScript

(function() {
    var manufacturers = ['Volkswagen', 'Audi', 'Mercedes', 'Skoda', 'Toyota', 'Renault', 'Volvo', 'Mazda'];
    
    $("#list").autocomplete({
        source: manufacturers
    });

    // Overrides the default autocomplete filter function to search only from the beginning of the string
    $.ui.autocomplete.filter = function (array, term) {
        var matcher = new RegExp("^" + $.ui.autocomplete.escapeRegex(term), "i");
        return $.grep(array, function (value) {
            return matcher.test(value.label || value.value || value);
        });
    };
})();