Как игнорировать элементы, добавленные для группировки - PullRequest
Новая
       22

Как игнорировать элементы, добавленные для группировки

0 голосов
/ 09 июля 2019

Я создал автозаполнение jQuery. Возвращаемые данные относятся к нескольким категориям, поэтому я хочу добавить группировку. Я добавляю имя группы всякий раз, когда новая группа найдена, потому что мои данные отсортированы. Я делаю это в методе _renderMenu (). Он показывает нормально, но добавленные элементы ведут себя как обычные элементы, поэтому они имеют фокус и выбирают событие, которое мне не нужно. Как я могу убедить autocomplete, что он будет игнорировать все элементы с классом 'ui-autocomplete-category'? 

$("#searchInput").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '@Url.Action("GetSearchData", "Account", new {Area = ""})',
                dataType: "json",
                data: { searchString: $("#searchInput").val() },
                success: function (data) {
                    response($.map(data, function (item) {
                        console.log(item);
                        return {
                            label: item.DisplayName, value: item.EntityInstanceId + "," + item.EntityId, categoryName: item.EntityDisplayName
                        };
                    }));
                },
                error: function (xhr, status, error) {
                    console.log("Error");
                }
            })
        },
        focus: function (event, ui) {
            if (!ui.item) {
                return false;
            }
            event.preventDefault();
        },
        delay: 400,
        select: function (event, ui) {
            if (!ui.item) {
                return false;
            }
            //do something
        }
    }).data("autocomplete")._renderItem = function (ul, item) {
        return $("<li style='margin-left: 8px; margin-right: 8px; margin-bottom: 3px;'></li>")
            .data("item.autocomplete", item)
            .append("<a style='color: #3e9645; font-family: Segoe UI;'>" + item.label + "</a>").appendTo(ul);
        };

    $("#searchInput").autocomplete().data("autocomplete")._renderMenu = function (ul, items) {
        var that = this;
        var currentEntity = "";
        $.each(items, function (index, item) {
            var itemEntity = item.value.split(",")[1];
            if (currentEntity !== itemEntity) {
                ul.append("<li class='ui-autocomplete-category'>" + item.categoryName + "</li>");
                console.log(item);
                currentEntity = itemEntity;
            }

            that._renderItemData(ul, item);
        });
    }

1 Ответ

0 голосов
/ 09 июля 2019

Разобрался, пришлось добавить этот код: 

create: function (event, ui) {
      $(this).data('ui-autocomplete').menu.options.items = "> :not(.ui-autocomplete-category)";
}

Так что автозаполнение теперь игнорирует все элементы с этим классом

...