可以't让jQuery autoComplete进行筛选

Can't get jQuery autoComplete to filter

本文关键字：autoComplete 筛选 jQuery 可以      更新时间：2023-09-26

嗨，我正在尝试让jQuery的autoComplete ui正常工作。

目前，我有一个asp.net文本框，我正在调用一个Web服务，并将该列表的结果链接到文本框。我调用的Web服务从SQL数据库获取未经筛选的结果列表。

public List<string> getAutoCompleteList() {
    DataSet dsAutoList = getAutoList();
    DataTable dtAutoList = dsAutoList.Tables[0];
    List<string> lstTitles = new List<string>();
    foreach (DataRow drAutoList in dtAutoList.Rows)
    {
        //zAutolist = zAutolist + drAutoList["course_title"].ToString();
        lstTitles.Add(drAutoList["course_title"].ToString());
    }
    return lstTitles;
}

将该列表分配给文本框的javascript是（加载时）

function autoComplete() {
    $(".txtSearch").autocomplete({
        source: function(request, response) {
            $.ajax({
                url: "/webservice/wsJQueryAutoComplete.asmx/getAutoCompleteList",
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                //dataFilter: function(data) { return data; },
                success: function(data) {
                    response($.map(data.d, function(item) {
                        return { value: item }
                    }))
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    alert(textStatus);
                }
            });
        },
        minLength: 3    // MINIMUM 3 CHARACTER TO START WITH.
    });
}

一切都很好，如果我开始在文本框中键入，结果就会出现，但问题是，结果列表并没有根据我在搜索框中键入的内容进行过滤，它只是显示列表中的每个项目，无论我键入什么，都不会进行过滤。

有人能抽出几分钟时间让我知道我做错了什么吗？

谢谢，Craig

由于您不想根据输入动态填充搜索项，因此必须在初始化自动完成之前将搜索项填充到数组中，即将$.ajax调用移动到自动完成调用之外：

$.ajax({
    url: "/webservice/wsJQueryAutoComplete.asmx/getAutoCompleteList",
    dataType: "json",
    type: "POST",
    contentType: "application/json; charset=utf-8",
    // Changed here:
    success: function(data) {
        $(".txtSearch").autocomplete({
             source: data.d
        });
    }
});

因此，在初始化jquery自动完成时，您将传递一个预先填充的数组作为源参数，这将导致过滤器对静态列表进行操作。

$(".txtSearch").autocomplete({
    source: prepopulatedList
});
相关文章：