js autocomplete implements drop-down fuzzy query

1. js writing

// Gaining focus is to re-query
$("#xxx").focus(function () {
            $("#xxx").autocomplete("search");
        });
 // retrieve information (fuzzy match)
        $("#xxx").autocomplete({
            scrollHeight:180,
            scroll:true,
            delay: 500, // delay 500ms for easy input
            source: function (request, response) {
                $.ajax({
                    url: '${ctx}/xx/xxxx',
                    type: "post",
                    dataType: "json",
                    data: {"xxx": $("#xxx").val()},
                    success: function (data) {
                        var obj = $ .parseJSON (data.data);
                        var dataArr = obj.data;
                        response($.map(dataArr, function (item) {
                            return {
                                result: item,
                                label: item.name,
                                value: item.code
                            }
                        }));
                    }
                });
            },
            select: function (event, ui) {
                $("#xx").val(ui.item.label);
                $("#xx").val(ui.item.value);
                $("#xxxx").val(ui.item.result.id);
                $("#xx").val(JSON.stringify(ui.item.result));
                return false;
            }
        });

2. Set the drop-down box (add the following css code)

.ui-autocomplete {
            max-height: 300px;
            overflow-y: auto;
            overflow-x: hidden;
        }
        html .ui-autocomplete {
            height: 300px;
        }

3. Introduce the corresponding file
to import the attachment content