JSFiddle - React, Tailwind, and code Playground

by meridius

HTML

<div class="autoc_multi">
    <input id="presne" name="presne" type="text" value="" class="autocomplete" />
    <input id="presne_id" name="presne_id" type="hidden" value="" />
</div>

JavaScript

(function ($) {
    $.fn.autocompleteMuj = function (o) {
        function highlight(heystack, needle) {
            var find = needle.split(" ");
            var matcher;
            for (i in find) {
                matcher = new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(find[i]) + ")(?![^<>]*>)(?![^&;]+;)", "ig");
                heystack = heystack.replace(matcher, "<strong>$1</strong>");
            }
            return heystack;
        }

        o = $.extend({
            doCache: true,
            doAjax: true,
            ajaxFile: "",
            ajaxResponseObject: function (item, request) {
                return {
                    value: item.value,
                    nazev: item.nazev,
                    nazev_hl: highlight(item.nazev, request.term)
                }
            },
            displayDataFormat: function (item) {
                return item.nazev_hl;
            },
            onSelect: function (event, ui, box, boxID) {
                box.val(ui.item.nazev);
                boxID.val(ui.item.value);
            },
            onChange: function (event, ui, box, boxID) {
                if (!ui.item && box.val() != "") { // hodnota neni v nabidce (nic neni vybrano && neco je zadano)
                    box.tooltip({
                        position: {
                            my: "left top",
                            at: "left bottom",
                            collision: "flipfit"
                        }
                    })
                        .attr("title", "Vyberte jednu z nabízených možností.").tooltip("open");
                    setTimeout(function () {
                        box.tooltip("close").attr("title", "");
                    }, 2500);
                }
            }
        }, o);

        this.each(function () {
            var box = $(this);
            var boxID = $("#" + box.attr("id") + "_id");
            if (o.doCache == true) var cache = {};

           ...